60

我有一个对象数组，我正在使用 anng-repeat来迭代它们，这很容易。数组看起来像这样：

$scope.steps = [
    {companyName: true},
    {businessType: true},
    {physicalAddress: true}
];

我的ng-repeat属性看起来像：

<div ng-repeat="step in steps"> ... </div>

在每次迭代step中，如预期的那样，等于其中一个对象。无论如何都可以访问step对象的键和值吗？这样我就可以做这样的事情：

<div ng-repeat="(stepName, isComplete) in steps"> ... </div>

其中stepName=='companyName'和isComplete== true。我试过做这件事，但stepName总是最终成为 step 对象的索引（这是有道理的）。我只是想弄清楚是否有另一种编写ng-repeat语法的方法，以便我可以获得键和值。

感谢您的任何想法/建议。非常感激。

PS。我目前的解决方法是在我的控制器中执行此操作：

$scope.stepNames = [];
angular.forEach($scope.steps, function(isComplete, stepName){
     $scope.stepNames.push({stepName: stepName, isComplete: isComplete});
});

然后对其进行迭代，但最好在视图中完成所有操作

4

6 回答 6

109

中继器内的中继器

<div ng-repeat="step in steps">
    <div ng-repeat="(key, value) in step">
        {{key}} : {{value}}
    </div>
</div>
于 2013-10-23T14:46:35.077 回答
17

事实上，你的数据设计得并不好。你最好使用类似的东西：

$scope.steps = [
    {stepName: "companyName", isComplete: true},
    {stepName: "businessType", isComplete: true},
    {stepName: "physicalAddress", isComplete: true}
];

然后很容易做你想做的事：

<div ng-repeat="step in steps">
 Step {{step.stepName}} status : {{step.isComplet}}
</div>

示例：http: //jsfiddle.net/rX7ba/

于 2013-10-23T14:58:18.430 回答
7

如果这是您的选择，如果您将数据放入对象形式，它会按照我认为您希望的方式工作：

$scope.steps = {
 companyName: true,
 businessType: true,
 physicalAddress: true
};

这是一个小提琴：http: //jsfiddle.net/zMjVp/

于 2013-10-23T15:06:13.807 回答
3

我认为问题在于您设计数据的方式。就语义而言，对我来说，这没有任何意义。步骤究竟是做什么用的？

它是否存储一个公司的信息？

如果是这种情况，步骤应该是一个对象（请参阅 KayakDave 的答案），并且每个“步骤”都应该是一个对象属性。

它是否存储多个公司的信息？

如果是这种情况，步骤应该是一个对象数组。

$scope.steps=[{companyName: true, businessType: true},{companyName: false}]

在任何一种情况下，您都可以使用一个（第二种情况下两个）ng-repeats 轻松地遍历数据。

于 2013-10-23T16:17:39.880 回答
2

这是另一种方式，无需嵌套中继器。

来自Angularjs 文档：

可以使用以下语法让 ngRepeat 迭代对象的属性：

<div ng-repeat="(key, value) in steps"> {{key}} : {{value}} </div>
于 2016-02-09T19:03:09.483 回答
-1

似乎在 Angular 1.3.12 中你不再需要内部 ng-repeat，外部循环返回集合的值是单个映射条目

于 2015-02-21T05:45:42.513 回答