使用ng-repeat在对象内部的数组上迭代

问题描述：

我刚刚发布了一个问题。我正在考虑编辑这个问题，但我决定不这样做，这样我就不会混淆任何人。区别在于属性的类型现在是一个集合（一个数组）。使用ng-repeat在对象内部的数组上迭代

{ 
    "attributes": [{ 
    "scott": { 
     "fullname": "Scott D Man", 
     "age": 48 
    } 
    }, { 
    "bill": { 
     "fullname": "William Shatner", 
     "age": 45 
    } 
    }] 
}

我仍然想要做同样的输出，使用ng-repeat显示它们的关键，全名和年龄。

使用纳克重复=“属性“，然后 Object.keys（属性）[0]，Object.keys（属性）[0] .fullname和Object.keys（属性）[0] .age – binariedMe

我对你的回应很感兴趣，因为你只提到了一个ng-repeat。现在，我的代码使用单个ng-repeat，并希望不添加另一个ng-repeat。如果你制作一个示例html，可以吗？因为我们已经有了上面的数据，所以不需要创建控制器。我很想看看ng-repeat如何使用您的解决方案。谢谢。 – devwannabe

答

你可以做到这一点，如下

<div ng-repeat="attr in model.attributes"> 
    <div ng-repeat="(key, value) in attr"> 
     Name: {{key}} 
     Full Name: {{value.fullname}} 
     Age: {{value.age}} 
    </div> 
    </div>

这就是我之前计划要做的事情，但我希望能够通过使用单个ng-repeat来实现 – devwannabe

答

我说的是这样的：

<div ng-repeat="attr in model.attributes"> 
{{getKeys(attr)}} 
<div>{{attr[keys[0]]}}</div> 
<div>{{attr[keys[0]].fullname}}</div> 
<div>{{attr[keys[0]].age}}</div> 
</div>

这里getKeys（）函数将是：

getKeys(attr){$scope.keys = Object.keys(attr);}

不过我想尝试把这样的数据：

{ “属性”：[{ “属性”： “斯科特”， “全称”： “斯科特d人”， “年龄”：48 }] }

我无法更改数据，因为它是我们的api团队的组织者。无论如何，我有你的想法。 – devwannabe

而您可以事先修改数据，以免混乱视图。而不是在ng-repeat之后进行getKeys。一旦你从API获取数据，使用函数modulateData（），然后在任何麻烦的情况下永远在你的html中使用它。 – binariedMe

我真的这样做，使我现有的HTML模板将是相同的，它的工作。 :) – devwannabe

使用ng-repeat在对象内部的数组上迭代

相关推荐