どのようにNGリピート

Question

を使用してオブジェクト内のオブジェクトを反復処理する私はこのようになりますオブジェクトのコレクションがあります。私が使用している場合

[{ 
    "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> 

私はオブジェクト全体の文字列を取得し、 "deepSubObj"文字列の配列は、期待通りですが、試してみると：

私は何も得られません。

これは、この配列を反復処理する正しい方法ではありませんか？他に何が間違っているのでしょうか？

Answer 1

ng-repeatタグがネストされている場合、everything is straightforward。

問題はレイアウトに関連し、ng-repeat反復には関連しません。 <td>タグの外側の表で<div>タグが許可されていないと、表が正しく表示されません。

ネストされたngRepeatディレクティブを使用すると、オブジェクトによってはパフォーマンスが低下する可能性があります。出力前にデータを準備することは、しばしばより良い解決策です。

Answer 2

HTML

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" 
        }] 
       }, 
      }] 
     }); 

効果