Dokonywanie zachowanie hiperłączy warunkowego w angularjs

Question

w kątowym aplikacji, mam listę hiperłączy, które muszą mieć następujące zachowanie:

• gdy pewien warunek jest obecny (np czy dany plik cookie ma wartość x), kliknięcie hiperłącza powinno otworzyć okno modalne;

• jeśli ten warunek nie jest spełniony (np. Jeśli plik cookie ma wartość y), hiperłącze powinno działać w zwykły sposób i otworzyć łącze w nowej karcie.

Hiperłącza są formatowane następująco:

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

jestem zaskoczony, jak wdrożyć takiego zachowania. Jeśli zostawię obie dyrektywy: ng-href i ngclick, wtedy ng-href wstawi adres URL, a każde kliknięcie otworzy stronę w nowej karcie. Jeśli usuniemy dyrektywę ng-href, jedynym sposobem otwarcia łącza na innej karcie będzie javascript, ale większość przeglądarek temu zapobiega. Nie mogłem wymyślić sposobu na warunkowanie (na przykład pisanie <a ng-href="myCondition === true ? {{article.url}} : '#'"> nie działa).

Czy mógłby Pan zaproponować sposób wdrożenia takiej funkcjonalności w Angular?

Answer 1

Oto, co wymyśliłem. Wygląda to rodzaj brzydki, więc jeśli masz lepsze propozycje, są bardzo mile widziane:

pisałem dwa osobne tagi kotwiczna z różnych zachowań i wykonane kątowa wybierać między nimi w zależności od tego, czy konieczny warunek jest spełniony:

 <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> 

W pliku javascript napisałem funkcję checkCookies(), która wyszukuje wartość danego pliku cookie.

Answer 2

ten pracował dla mnie

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

Answer 3

Oto nieco inne podejście, że pracował dla mnie, nie używać ng-href w ogóle:

HTML:

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

Kontroler:

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