ng-repeat 可以在 Angular Js 中获取用户定义的 $index 增量吗？

Question

纯HTML:

<div class="table-tr museo_sans500">
    <div class="table-td"><a href="javascript:void(0)">fgfbgfbfg</a></div>
    <div class="table-td"><a href="javascript:void(0)">Wtrtrdgdgf</a></div>
    <div class="table-td"><a href="javascript:void(0)">Wayne Rooney</a</div>
    <div class="table-td"><a href="javascript:void(0)">fghgfhgfhgf</a></div>
</div>
<div class="table-tr museo_sans500">
    <div class="table-td"><a href="javascript:void(0)"hgfhgfhfg</a></div>
    <div class="table-td"><a href="javascript:void(0)">asdasdasdas</a></div>
    <div class="table-td"><a href="javascript:void(0)">testsfsdfs</a></div>
    <div class="table-td"><a href="javascript:void(0)">gfhgfhfghgf</a></div>
</div>

我需要让它动态化，我正在使用 Angular JS 和 PHP。我已经在 angular $scope.teamSquad 中获取数据并按以下方式实现它：

<div class="table-tr museo_sans500" ng-repeat="(key,squad) in teamSquad">
     <div class="table-td"><a href="javascript:void(0)">{{squad.PlayerName}}</a></div>
</div>

但我在每增加一个值后添加 </div><div class="table-tr museo_sans500"> 时遇到问题。

我已经试过了 {{key%4==0 ? '</div><div class="table-tr museo_sans500">' : ''}} 但它不起作用。

我也试过了，结果是一样的。

Answer 1

正如@entre所说，你应该使用嵌套的ng-repeat来完成这个任务

 <div class="table-tr museo_sans500" ng-repeat="squadChunk in teamSquad">
   <div class="table-td" ng-repeat="squad in squadChunk"><a href="javascript:void(0)">{{squad.PlayerName}}</div>
</div>

将你的数组拆分成块（大小为 4）

var _teamSquad = [
{PlayerName: 1},
{PlayerName: 2},
{PlayerName: 3},
{PlayerName: 4},
{PlayerName: 5},
{PlayerName: 6},
{PlayerName: 7},
{PlayerName: 8}
];

$scope.teamSquad = [];

var size = 4;
while (_teamSquad.length > 0)
$scope.teamSquad.push(_teamSquad.splice(0, size));

Complete Solution

ng-repeat 可以在 Angular Js 中获取用户定义的 $index 增量吗？

Can ng-repeat take user defined $index increment in Angular Js?

html

javascript

angularjs

angularjs-ng-repeat

angularjs-ng-if