ng-repeat:访问对象数组中每个对象的键和值
我有一个对象的数组,我用一个ng-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
总是最终成为步骤对象的索引(这是有道理的)。 我只是试图找出是否有另一种方式来编写ng-repeat
语法,以便我可以获得键和值。
感谢您的任何想法/build议。 非常感激。
PS。 我目前的工作是在我的控制器中执行此操作:
$scope.stepNames = []; angular.forEach($scope.steps, function(isComplete, stepName){ $scope.stepNames.push({stepName: stepName, isComplete: isComplete}); });
然后再重复一遍,但是在视图中完成这一切将是很好的
中继器内的中继器
<div ng-repeat="step in steps"> <div ng-repeat="(key, value) in step"> {{key}} : {{value}} </div> </div>
事实上,你的数据devise不好。 你最好使用像这样的东西:
$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/
如果这是你的select,如果你把你的数据到对象forms,它的工作方式,我认为你希望:
$scope.steps = { companyName: true, businessType: true, physicalAddress: true };
这是一个小提琴: http : //jsfiddle.net/zMjVp/
我认为问题在于你devise数据的方式。 就语义而言,对我来说,这是没有意义的。 到底什么是步骤?
它是否存储一家公司的信息?
如果是这样的话,步骤应该是一个对象(请参阅KayakDave的答案),每个“步骤”应该是一个对象属性。
它是否存储多个公司的信息?
如果是这种情况,步骤应该是一个对象数组。
$scope.steps=[{companyName: true, businessType: true},{companyName: false}]
在任何一种情况下,都可以用一个(两个用于第二种情况)的ng-repeats轻松地迭代数据。
这是另一种方式,不需要嵌套中继器。
从Angularjs文档 :
使用下面的语法可以让ngRepeat遍历一个对象的属性:
<div ng-repeat="(key, value) in steps"> {{key}} : {{value}} </div>
好像在Angular 1.3.12中你不需要内部的ng-repeat了,外部循环返回集合的值是一个单一的映射条目