2015-02-08 131 views
7

在角度應用條件的行爲,我有需要有以下行爲的超鏈接的列表:製作超鏈接在AngularJS

  • 如果某個條件存在(如果某個cookie擁有值,例如, x),點擊超鏈接應該打開一個模式窗口;

  • 如果未滿足此條件(例如,如果Cookie的值爲y),則超鏈接應以其常規方式進行操作並在新選項卡中打開該鏈接。

超鏈接的格式如下:

<a ng-href="{{article.url}}" target="_blank" ng-click="myFunction()"> 
    {{article.title}} 
</a> 

我對如何實現這樣的行爲感到不解。如果我離開ng-hrefngclick指令,則ng-href將插入url,並且每次點擊都會在新選項卡中打開一個頁面。如果我刪除ng-href指令,那麼在另一個選項卡中打開鏈接的唯一方法是通過javascript,但大多數瀏覽器都會阻止這種操作。我想不出一種方法來使ng-href條件(例如,寫作<a ng-href="myCondition === true ? {{article.url}} : '#'">不起作用)。

您能否提出一種如何在Angular中實現這樣的功能的方法?

+1

似乎有條件地需要包含或刪除'target'屬性。也許看看這裏? http://stackoverflow.com/questions/23584201/conditionally-add-target-blank-to-links-with-angular-js – 2015-02-08 18:29:20

+0

處理控制器內部的邏輯是否重定向或打開模式彈出 – 2015-02-08 18:30:48

回答

1

這是我想出來的。它看起來有點難看,所以如果你有更好的建議,他們都非常歡迎:

我寫了不同的行爲兩個獨立的錨標記並提出根據所需的條件是否滿足它們之間的角度選擇:

 <a href="#" ng-if="checkCookies() === 'show popup'" ng-click="openArticle(article)"> 
     {{$parent.article.title}} 
     </a> 

     <a ng-href="{{$parent.article.url}}" target="_blank" ng-if="checkCookies() === 'no popup'"> 
     {{$parent.article.title}} 
     </a> 

而在javascript文件中,我編寫了查找特定cookie值的checkCookies()函數。

11

這爲我工作

<a ng-href='{{(element.url.indexOf("#")>-1) ? element.url : element.url + "client_id="}}{{credible.current_client_info.client_id}}'>{{element.title}}</a> 
2

這是一個有點不同的方法,爲我工作,沒有采用NG-HREF可言:

HTML:

<a ng-click="myFunc()">{{article.title}}</a> 

控制器:

$scope.myFunc = function() { 
    if (myCondition){ 
    window.open($scope.article.url,'_self',false); 
    } 
    window.open("/#/",'_self',false); 
};