Angularjs 如何使用ng repeat在对象内部迭代对象

我有一组如下所示的对象：

[{
  "mainObj": "main1",
  "subObjArray":{
                 "subObj": "sub1",
                 "deepSubObjArray":[{
                                     "deepSubObj": "deep1",
                                     "property": "something",
                                     },{
                                     "deepSubObj": "deep2",
                                     "property": "somethingElse"
                                   }]
               },
  },{
  "mainObj": "main2",
  "subObjArray":{
                 "subObj": "sub2",
                 "deepSubObjArray":[{
                                     "deepSubObj": "deep3",
                                     "property": "something",
                                     },{
                                     "deepSubObj": "deep4",
                                     "property": "somethingElse"
                                   }]
               },
}]

如果我使用：

<tr ng-repeat="mainObj in mainObjArray">
<td>{{mainObj}}</td>
<td>{{mainObj.subObjArray.deepSubObjArray}}</td>

{{mainObj}}
{{mainObj.subObjArray.deepSubObjArray}

我按预期获得了整个对象字符串和“deepSubObj”字符串数组，但如果我尝试：

<tr ng-repeat="mainObj in mainObjArray">
<div ng-repeat="deepSubObj in mainObj.subObjArray.deepSubObjArray">
<td>{{deepSubObj}}</td>
</div></tr>

{{deepSubObj}}

我什么也得不到

---

这不是迭代该数组的正确方法吗？还有什么问题吗？

当

ng repeat

标记嵌套时

该问题与布局有关，而不是与

ng repeat

迭代有关<在

标记之外的表中不允许使用code>标记，这将导致表呈现不正确

---

根据对象的不同，使用嵌套的

ngRepeat

指令可能对性能有害。在数据输出之前准备数据通常是一个更好的解决方案。

当嵌套

ng repeat

标记时

该问题与布局有关，而不是与

ng repeat

迭代有关<在

标记之外的表中不允许使用code>标记，这将导致表呈现不正确

根据对象的不同，使用嵌套的

ngRepeat

指令可能对性能有害。在数据输出之前准备数据通常是更好的解决方案。

html 影响

html 影响

---

是的，很抱歉。我的意思是：ng repeat=“mainObj in mainObjArray”ng repeat=“deepsubbj in mainObj.subObjArray.deepsubbjarray”已编辑，但我想您在那之前读过它。@ArtemioRamirez它不是有效的html。如果在同一个元素上执行此操作，则不，它将不起作用。Nested ng repeat应该是嵌套元素，我实际上在使用@ArtemioRamirez，我已经根据当前代码更新了答案。这正是我的问题，通过多次使用Thx解决了。是的，很抱歉。我的意思是：ng repeat=“mainObj in mainObjArray”ng repeat=“deepsubbj in mainObj.subObjArray.deepsubbjarray”已编辑，但我想您在那之前读过它。@ArtemioRamirez它不是有效的html。如果在同一个元素上执行此操作，则不，它将不起作用。Nested ng repeat应该是嵌套元素，我实际上使用@ArtemioRamirez，我已经根据当前代码更新了答案。这正是我的问题，通过大量使用Thx解决了。

<div ng-controller="MyCtrl">
    <ul>
        <li ng-repeat="mainObj in mainObjArray">
            {{mainObj.mainObj}}
            <ul>
                <li ng-repeat="deepSubObj in mainObj.subObjArray.deepSubObjArray">
                    {{deepSubObj.deepSubObj}}
                </li>
            </ul>
        </li>
    </ul>
</div>

angular.module('myApp', [])
        .controller('MyCtrl', function ($scope) {
            $scope.mainObjArray = [{
                "mainObj": "main1",
                "subObjArray": {
                    "subObj": "sub1",
                    "deepSubObjArray": [{
                        "deepSubObj": "deep1",
                        "property": "something",
                    }, {
                        "deepSubObj": "deep2",
                        "property": "somethingElse"
                    }]
                },
            }, {
                "mainObj": "main2",
                "subObjArray": {
                    "subObj": "sub2",
                    "deepSubObjArray": [{
                        "deepSubObj": "deep3",
                        "property": "something",
                    }, {
                        "deepSubObj": "deep4",
                        "property": "somethingElse"
                    }]
                },
            }]
        });