Question

我有一个像这样的JSON结构（myTags）：

[ 
  { "tag1" : [{"id" : 1} , {"id" : 2 }] } ,
  { "tag2" : [{"id" : 3} , {"id" : 4 }] }
]

在ng-repeat块中，我想访问tag1和tag2。

我尝试使用这样的键值：

<div ng-repeat ="(key,val) in myTags">
    <div class="block">
        <a href="">{{key}}</a>
    </div>
</div>

但是键是0和1而不是tag1和tag2。我该如何访问它们？

Answer 1

正如其他答案所提到的，这里的嵌套不正确。

试试这个：

<div ng-repeat="tag in myTags">
   <div ng-repeat="(key, array) in tag">
     <div class="block">
       <a href="">{{key}}</a>
       {{array}}
     </div>
   </div>
</div>

http://plnkr.co/edit/IwxeUgVF7SkMp8xRAvH7?p=preview

您希望首先输出每个对象，然后遍历每个对象并将其与内部数据数组分开。

Answer 2

我认为您可以使用嵌套的ng-repeat来循环对象的属性。

<div ng-repeat="obj in myTags">
    <div class="block" ng-repeat="(key, value) in obj">
      <a href="">{{key}}</a>
    </div>
  </div>

工作示例：http://codepen.io/mkl/pen/oLYrro

Answer 3

Angular按预期工作。由于myTags是一个数组，因此键当然是每个对象的索引。你认为作为一个关键的东西实际上只是一些不断变化的属性名称，它没有以特别有用的方式设置。

我建议您更改服务以返回不同格式的内容。例如，如果您的myTags是对象而不是数组，则代码可以正常工作。理想情况下，您的对象如下所示：

myTags = { 
   "tag1" : [{"id" : 1} , {"id" : 2 }] ,
   "tag2" : [{"id" : 3} , {"id" : 4 }]
};

见demo。

如果您在问题中被戴上手铐进行格式化，则应该从数组中的每个对象中提取数据。 Michael's answer是一个良好的开端。将标记更改为以下内容：

<div ng-repeat ="obj in myTags">
    <!-- each obj is an object with a single property whose value is an array-->
    <div class="block" ng-repeat="(key, value) in obj">
        <!-- only one key in the object you provided-->
        <a href="">{{key}}</a>
    </div>
</div>

Demo for this alternative

AngularJs - ng-repeat - 如何获取列表中元素的键？

3 个答案: