html – 在AngularJS中,我如何选择在链接中包装项目

发布时间：2020-12-14 18:41:23 所属栏目：资源来源：网络整理

导读：我有一个人的名字和一个可选的主页.如何选择将其名称包装在锚标记中？ ul ng-repeat='person in people' li a href="{{person.website}}" {{person.name}} /a /li/ul 或者在person.website为零的情况下 ul ng-repeat='person in people' li {{person.name}}

我有一个人的名字和一个可选的主页.如何选择将其名称包装在锚标记中？

<ul ng-repeat='person in people'>
  <li>
    <a href="{{person.website}}">
      {{person.name}}
    </a>
  </li>
</ul>

或者在person.website为零的情况下

<ul ng-repeat='person in people'>
  <li>
    {{person.name}}
  </li>
</ul>

在rails中,我将使用方法<％= link_to_unless person.website.blank？,seller.name,seller.website％>

我如何在AngularJS中执行此操作？

解决方法

您可以将以下函数添加到您的范围：

$scope.linkToUnless = function(condition,label,href) {
    return condition ? '<a href="'+href'+">'+label+'</a>' : label;
};

或者您可以将HTML重写为：

<ul ng-repeat='person in people'>
  <li>
    <a href="{{person.website}}" ng-if="person.website">
      {{person.name}}
    </a>
    <span ng-if="!person.website">
        {{person.name}}
    </span>
  </li>
</ul>

(仅仅是受OP评论启发的注释,ng-if仅在anugular 1.1.5之后可用;对于旧版本,使用ng-show和ng-hide代替

或者您可以编写自定义指令并使用它：

<link-to-if href="person.website" label="person.name" />

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!