machen Verhalten von Hyperlinks bedingten in AngularJS

Question

in einem Winkel app, ich habe eine Liste von Hyperlinks, die das folgende Verhalten haben müssen:

• wenn eine bestimmte Bedingung vorliegt (zB wenn ein bestimmter Cookie hat einen Wert x), ein Klick auf den Hyperlink sollte ein modales Fenster öffnen;

• Wenn diese Bedingung nicht erfüllt ist (z. B. wenn der Cookie den Wert y hat), sollte der Hyperlink wie gewohnt funktionieren und den Link in einem neuen Tab öffnen.

Die Hyperlinks formatiert sind wie folgt:

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

Ich bin verwirrt durch, wie ein solches Verhalten zu implementieren. Wenn ich sowohl ng-href als auch ngclick Direktiven belasse, fügt ng-href die URL ein und jeder Klick öffnet eine Seite in einem neuen Tab. Wenn ich die ng-href Direktive entferne, dann ist der einzige Weg, um einen Link in einem anderen Tab zu öffnen, über Javascript, aber dies wird von den meisten Browsern verhindert. Ich konnte mir keinen Weg vorstellen, ng-href bedingt zu machen (zum Beispiel funktioniert das Schreiben von <a ng-href="myCondition === true ? {{article.url}} : '#'"> nicht).

Könnten Sie bitte eine Möglichkeit vorschlagen, wie Sie eine solche Funktionalität in Angular implementieren können?

Answer 1

Hier ist, was ich gefunden habe. Es sieht irgendwie hässlich, wenn Sie also bessere Vorschläge haben, sind sie sehr willkommen:

ich zwei separate Anker-Tags mit unterschiedlichen Verhaltensweisen geschrieben und gemacht Angular wählen zwischen ihnen je nachdem, ob oder nicht die notwendige Bedingung erfüllt ist:

Und in der Javascript-Datei, schrieb ich die checkCookies() Funktion, die den Wert des bestimmten Cookie nachschlägt.

Answer 2

Dieser arbeitete für mich

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

Answer 3

hier etwas anderen Ansatz ist die für mich gearbeitet, nicht genutzt ng-href überhaupt:

HTML:

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

Steuerung:

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