Question

我正在使用AngularJS构建应用程序。在这个应用程序内部，我希望每行有2个按钮，除非总按钮不均匀。如何让代码停止创建最后一个col？

使用下一个代码，第6个按钮（在包含5个项目的数组上）为空。我不想在屏幕上显示这个。

<div ng-repeat="tool in tools">
  <div class="row" ng-if="$even">
    <div class="col" ng-repeat="tool in [tools[$index],tools[$index + 1]]">
      <button class="button button-block button-{{tool.color}}">
        <i class="icon {{tool.icon}}"></i>
        <br>{{tool.name}}
        </button>
    </div>
  </div>
</div>

Answer 1

切换内部ng-repeat以使用limitTo过滤器;

<div ng-repeat="tool in tools">
  <div class="row" ng-if="$even">
    <div class="col" ng-repeat="tool in tools | limitTo:2:$index">
      <button class="button button-block button-{{tool.color}}">
        <i class="icon {{tool.icon}}"></i>
        <br>{{tool.name}}
        </button>
    </div>
  </div>
</div>

angularjs在最后一个项目停止ng-repeat

1 个答案: