使用 ng-repeat 每 5 个项目添加

Question

我正在尝试使用 ng-repeat 在确定数量的元素之后获取 html   标记。例如，每第 5 个按钮都会附加一个  。我尝试了多种方法，但似乎无法正确处理。如果有人能给我一些关于如何实现这一目标的指示，我将不胜感激。提前致谢。

<button type="button" class="btn btn-default btn-small" ng-repeat="item in items"
     {{item}}
</button>

Answer 1

您可以使用 ng-repeat 的 $index 检查每五个元素，之后您可以使用 ng-show 指令相应地显示  

<br ng-show="($index + 1) % 5 == 0" />

Answer 2

我假设这应该是每个   之前的一排按钮？最简单的方法是创建一个按钮容器来重复，并使用 ngIf directive alongside the $index property of ngRepeat 来确定   是否应该存在：

<span ng-repeat="item in items">  
  <button type="button" class="btn btn-default btn-small">{{ item }}</button>
  <br ng-if="$index && $index % 4 == 0">
</span>

ngIf 中的第一个 $index 将在第一个索引上评估为 false（因为它是第 0 个索引，所以你不会提前换行）和 $index % 4将对应第5个按钮整体占第0个索引。

使用 ng-repeat 每 5 个项目添加 <br>

Add a <br> every 5 item with ng-repeat

angularjs