Question

对嵌套对象使用ng-repeat是否存在已知问题？我有以下JSON数据：

{
Table: [
{
contract_type: "Division Level"
}
],
Table1: [
{
division: "Illinois"
}
],
Table2: [
{
cost_center: "8646 - Administration"
}
],
Table3: [
{
organization: "XYZ"
},
{
organization: "ABC"
}
],
Table4: [
{
settingname: "Medical Care",
HCO: "XYZ"
},
{
settingname: "Progressive Care",
HCO: "ABC"
}
]
}

我的模板看起来像这样：

<li class="twocolumns">
    <label>Contract Type:</label>
    <label>{{displayFields.Table[0].contract_type}}</label>
</li>
<li class="twocolumns">
    <label>Division:</label>
    <label>{{displayFields.Table1[0].division}}</label>
</li>
<li class="twocolumns">
    <label>Cost Center:</label>
    <label>{{displayFields.Table2[0].cost_center}}</label>
</li>

<li ng-repeat="item in displayFields.Table4[0]" class="twocolumns">
    <label>{{item.settingname}}</label>
    <label>{{item.HCO}}</label>
    foo
</li>

导致此输出：

合同类型：分部级别分部：伊利诺伊州成本中心：8646 - 管理 FOO FOO。

正如你可以通过＆＃34; foo＆＃34;这两行看到的那样，ng-repeat正在查看项目并迭代它们。但是，访问item.settingname等项目属性不起作用。

我们正在使用角度1.2.0-rc2，如果重要的话。

Answer 1

你正在迭代这个：

item in displayFields.Table4[0]

实际上，您希望迭代Table4本身。删除[0]应该有效，因为repeat将基于与Table4关联的数组。实际上，您正在尝试迭代Table4数组的第一个对象。

两个foo输出本身指的是settingname和HCO，而不是Table4的实际元素。这里真正发生的是角度试图打印这个：

ng-repeat的第一次迭代将item作为Table4[0].settingname，结果如下：

<label>{{Table4[0].settingname.settingname}}</label>
<label>{{Table4[0].settingname.HCO}}</label>

这两个属性都是不可取的，导致什么都没有。然后打印最后的foo。

第二次迭代完全相同，item为Table4[0].HCO除外。

Answer 2

你可以遍历对象属性

<li ng-repeat="(key, value) in yourCollection">
    <label>{{key}}</label>
    <label>{{value}}</label>
</li>

问候

使用Ng-Repeat时无法访问嵌套项属性

2 个答案: