Question

在Angular应用程序中，我有一个需要具有以下行为的超链接列表：

如果存在某种条件（例如，如果某个cookie的值为x），则单击超链接应打开模态窗口;
如果不满足此条件（例如，如果cookie的值为y），超链接应按照通常的方式操作，并在新选项卡中打开链接。

超链接的格式如下：

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

我对如何实现这样的行为感到困惑。如果我同时保留ng-href和ngclick指令，则ng-href将插入网址，每次点击都会在新标签中打开一个网页。如果我删除ng-href指令，那么在另一个选项卡中打开链接的唯一方法是通过javascript，但大多数浏览器都会阻止这种情况。我无法想出让ng-href有条件的方法（例如，写<a ng-href="myCondition === true ? {{article.url}} : '#'">不起作用）。

请您介绍一下如何在Angular中实现这样的功能？

Answer 1

这对我有用

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

Answer 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);
};

Answer 3

这是我想出的。它看起来有点难看，所以如果你有更好的建议，我们非常欢迎：

我写了两个不同行为的锚标签，并根据是否满足必要条件让Angular在它们之间做出选择：

      <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文件中，我编写了checkCookies()函数，用于查找特定cookie的值。

在AngularJS中使超链接的行为成为条件

3 个答案: