AngularJS ui-sref外部（絕對）鏈接

我寫了一個小角度的應用程序。我已經有了一個菜單項的數組，我在我的模板打印：AngularJS ui-sref外部（絕對）鏈接

<nav id="menu"> 
    <ul> 
    <li ng-repeat="i in menuItems" 
     ui-sref="{{ i | removeSpacesThenLowercase }}" 
     ui-sref-active="active">{{ i }}</li> 
    </ul> 
</nav>

在我app.js我使用ui-router像宣稱我的狀態：

.state('camera', { 
    url: '/selection', 
    templateUrl: '/views/selection.html', 
    uiShade: 'light back',  
    back: 'intro' 
})

內部URL工作得很好，但如果我想要這樣做呢？

.state('facebook', { 
    url: 'https://www.facebook.com/' 
})

這顯然不起作用。在沒有兩個獨立數組的情況下，在我的模板中擁有一些外部（絕對）鏈接的最佳方法是什麼？

來源

2015-06-05 Bob Wassermann

[我怎麼會對UI路由器的可能的複製到一個外部鏈接，如google.com?](http://stackoverflow.com/questions/30220947/how-would-i-have -ui-router-go-to-an-external-link-such-google-com） – bjunix

Ui-sref指的是一個狀態。你的觀點是國家。外部網站不是州，它只是一些外部鏈接。

我建議你重構你的菜單生成處理不同類型的菜單項：

基於

狀態鏈接（鏈接通過ui-sref產生）
標準鏈接（生成的鏈接通過href，外部鏈接，電子郵件等）

然後你只需要填充menuItems與不同的對象

的

來源

2015-06-05 14:20:01

是的，我知道。這樣做會是一個好方法嗎？ –

-1

我通過爲外部鏈接和ng-click函數創建第二個數組來解決此問題。

$scope.elink = function(element) { 
    if (confirm("You're leaving the app, are you sure?")) { 
    window.location = element; 
    } 
};

來源

2015-06-05 18:35:24

我在我的應用程序中使用ng-if修復了這個問題。

實施例的菜單項：

 $scope.navItems = [{ 
     id: 1, 
     title: 'Internal Link', 
     href: null, 
     sref: 'internal-state' 
    }, 
    { 
     id: 2, 
     title: 'External Link', 
     href: 'https:/google.co.uk', 
     sref: null 
    }];

然後在HTML我設置在<li>的NG-重複但包括用於HREF一個<a>，一個用於SREF，每個都具有NG-如果。

 <li ng-repeat="item in navItems"> 
     <a ng-if="item.sref" ui-sref="{{item.sref}}">{{ item.title }}</a> 
     <a ng-if="item.href" href="{{item.href}}">{{ item.title }}</a> 
    </li>

來源

2017-07-06 12:26:55

AngularJS ui-sref外部（絕對）鏈接

回答

相關問題