Angular JS - ng-repeat 和循环条件答案

【问题标题】：Angular JS - ng-repeat and loop conditionsAngular JS - ng-repeat 和循环条件
【发布时间】：2014-02-16 14:05:47
【问题描述】：

嘿，我有这段代码：

<div ng-repeat="i in values">
{{i}}
</div>

它可以工作，但我想在循环中添加额外的条件，例如：

<div ng-repeat="i in values">
{{i}}
if(i !== 0){
<div></div>
}
</div>

我怎样才能做到这一点？

【问题讨论】：

【解决方案1】：

使用ng-if（或ng-show）：

<div ng-repeat="i in values">
   <div ng-if="i !== 0"></div>
</div>

附加到元素上，这将决定是否显示它。

但是，如果您只想在循环第一个或最后一个项目时执行某些操作，您也可以使用ng-repeat 的$first 和$last 属性。这些是documented with ng-repeat。并且可以这样使用：

<div ng-repeat="i in values">
   <div ng-if="$first"></div>
</div>

【讨论】：

ng-if 是比 ng-show 更好的解决方案，因为 ng-if 修改了 DOM。 ng-show 只显示/隐藏元素。
@RaviH 是的，这就是示例使用 ng-if 的原因。但是，根据您要实现的目标，它们都是有效的解决方案。
@DavinTryon 嘿，谢谢你，你知道我怎么能在同一个循环中放置一个增量变量吗？ :P 我想仅在 increment%3 === 0 的情况下在循环内显示一个 div，但我不知道如何:(
@sbaaaang ng-repeat 内置了一个：$index。您还可以使用 $odd 和 $even 来执行交替行之类的操作。
是的，应该这样做。

【解决方案2】：

使用ng-ifstatement

<div ng-repeat="i in values">
   {{i}}
   <div ng-if="i !== 0"></div>
</div>

【讨论】：