文章/答案/技术大牛

发布

问向ng-重复块添加HTML标记
EN

Stack Overflow用户

提问于 2016-05-20 14:58:22

回答 2查看 382关注 0票数 1

我正在尝试向ng-repeat块添加一个HTML块。这样做的目的是建立一个面包屑小径，在每个项目之间有一个雪佛龙。

<div class="pull-left breadcrumbs">
    <span ng-repeat="crumb in breadcrumbs">
        {{crumb.display}} {{$last ? '' : '<span class=\'fa fa-chevron-right\'></span>'}}
    </span>
</div>

然而，这并不像预期的那样呈现。

我还尝试在class=部分中更改双引号的单引号。

angularjs

回答 2

Stack Overflow用户

回答已采纳

发布于 2016-05-20 15:20:53

您可以使用ng-hide指令来完成它。如果表达式的计算结果为true，则此指令将隐藏元素。

<div class="pull-left breadcrumbs">
    <span ng-repeat="crumb in breadcrumbs">
        {{crumb.display}} 
        <span class="fa fa-chevron-right" ng-hide="$last"></span>
    </span>
</div>

或者您可以使用ng-if指令。

<div class="pull-left breadcrumbs">
    <span ng-repeat="crumb in breadcrumbs">
        {{crumb.display}} 
        <span class="fa fa-chevron-right" ng-if="!$last"></span>
    </span>
</div>

票数 1

Stack Overflow用户

发布于 2016-05-20 15:37:38

一种解决方案是利用angularjs特性，由$index跟踪。

$scope.maxlength = $scope.breadcrumbs.length-1;

并利用ng显示标记，仅当span不是中继器中的最后一项时才显示span。

<div ng-controller="MyController">
   <span ng-repeat="crumb in breadcrumbs track by $index">
        {{crumb.name}} <span ng-show="$index < maxlength" class="fa fa-chevron-right">></span>
   </span>
</div>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/37350005

复制

相似问题

问向ng-重复块添加HTML标记
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问向ng-重复块添加HTML标记EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问向ng-重复块添加HTML标记
EN