Angular ng-repeat迭代每次迭代多个项目

Question

我的控制器中有一本字典：

thing = {    

    key1 = value1,

    key2 = value2,

    ...

    keyN = valueN,

};

我正在使用ng-repeat进行迭代，如下所示： ng-repeat="(key, value) in thing"

但是我想一次迭代多个值，这样对于每次迭代，我可以使用key1: value1和key2: value2 ，然后下一个我可以使用key3: value3 ， key4: value4等。

有没有一种方法可以遍历ng-repeat，一次迭代多个项目？ 谢谢。

Answer 1

并非不更改模型的结构或使用其他结构。 后者的意思是，您可以使用键名创建一个数组，如下所示：

$scope.doubled = [['key1', 'key2'], ['key3', 'key4'], ... ];

然后迭代非常简单，例如：

<div ng-repeat="keys in doubled">
    <div ng-repeat="key in keys">
        {{ thing[key] }}
    </div>
</div>

这也是一种以可预测的方式进行迭代的更可靠的方法，因为您应注意，在迭代对象的属性时， 您不能 （或至少不应） 依赖于这些属性的特定顺序 （请参阅https：// github.com/angular/angular.js/issues/6210 ）。

Answer 2

我建议创建一个过滤器：

app.filter('coupledItems', function(){
        return function(items){

            var isEven = false;
            var coupledItems = [];
            var temp = {};
            angular.forEach(items, function(item){

                if(isEven){
                    temp['item2'] = item;
                    coupledItems.push(temp);
                    temp = {};
                }
                else{
                    temp['item1'] = item;
                }

                isEven = !isEven;
            });

            if(temp['item1']){ // If odd, put it to last item
                coupledItems.push(temp)
            }

            return coupledItems;
        }
    });

使用时：

<tr ng-repeat="item in items | coupledItems">
    <td>{{item.item1.key}}</td>
    <td>{{item.item2.key}}</td>
</tr>

Answer 3

是。 例：

ng-repeat="t in thing"

{{ t[$index] + t[$index+1] }}