Question

我想要实现的布局是：

<div>
    <div class="row">
        <div></div>
        <div></div>
    </div>
    <div class="row">
        <div></div>
        <div></div>
    </div>
    <div class="row">
        <div></div>
        <div></div>
    </div>
</div>

这样做可以获得div，但是如何在每两个项目之间添加分隔符？我觉得Angular应该有一个简单的方法来做到这一点。

<div>
    <div class="row">
        <div ng-repeat="object in objects"></div>
    </div>
</div>

Answer 1

我认为，你可以使用一些javascript和ng-repeat来解决它，比如

<div>
    <div class="row" ng-repeat="array in obj2">
        <div ng-repeat="object in array">{{object}}</div>
    </div>
</div>

然后在你的角度控制器中使用像

这样的对象数组创建一个名为obj2的新对象

$scope.obj2 = [];
while ($scope.objects.length) {
    $scope.obj2.push($scope.objects.splice(0, 2))
}

演示：Fiddle

Answer 2

如果我得到您想要做的事情，您可以使用rgRepeat的$index属性，然后使用modulo作为该索引：

<div ng-repeat="object in objects">
    <div>My Content</div>
    <div data-ng-show="$index % 3 == 0">My Seperator</div>
</div>

每两个项目使用分隔符进行AngularJS ng-repeat

2 个答案: