Décisions comportement de liens hypertextes conditionnelle dans AngularJS

Dans Angulaire de l'app, j'ai une liste d'hyperliens qui doivent avoir le comportement suivant:

  • si une certaine condition est présent (par exemple, si un certain cookie a une valeur x), un clic sur le lien hypertexte devrait ouvrir une fenêtre modale;
  • si cette condition n'est pas remplie (par exemple si le cookie a une valeur y), le lien hypertexte doit agir à sa manière habituelle et ouvrir le lien dans un nouvel onglet.

Les liens hypertextes sont mis en forme comme suit:

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

Je suis intrigué par la façon de mettre en œuvre un tel comportement. Si je laisse les deux ng-href et ngclick directives, puis ng-href va insérer l'url et cliquez sur chaque va ouvrir une page dans un nouvel onglet. Si je supprime le ng-href directive, alors le seul moyen pour ouvrir un lien dans un autre onglet à l'aide de javascript, mais ce n'est empêché par la plupart des navigateurs. Je ne pouvais pas penser à une façon de faire ng-href conditionnelle (par exemple, la rédaction de <a ng-href="myCondition === true ? {{article.url}} : '#'"> ne fonctionne pas).

Pourriez-vous s'il vous plaît suggérer une façon de la façon de mettre en œuvre une telle fonctionnalité dans Angulaire?

Semble que vous conditionnelle de la nécessité d'inclure ou de retirer la target attribut. Peut-être avoir un coup d'oeil ici? stackoverflow.com/questions/23584201/...
la poignée de la logique à l'intérieur de contrôleur si pour rediriger ou ouvrir modal popup

OriginalL'auteur azangru | 2015-02-08

  1. 11

    Cela a fonctionné pour moi

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

    OriginalL'auteur Sage

  2. 2

    Ici est un peu différente de l'approche qui a fonctionné pour moi, n'utilisez pas de ng-href à tous:

    HTML:

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

    Contrôleur:

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

    OriginalL'auteur Vali D

  3. 1

    Est ici que je suis venu avec. Il semble que le type de laid, donc si vous avez de meilleures suggestions, elles sont les bienvenues:

    J'ai écrit deux balises d'ancrage avec des comportements différents et faites Angulaire de choisir entre eux, en fonction de si oui ou non la condition nécessaire est atteint:

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

    Et dans le fichier javascript, j'ai écrit le checkCookies() fonction qui recherche la valeur du cookie particulier.

    OriginalL'auteur azangru