ng-repeatの内部でいくつかの未知のng-repeatを実行しています

Question

私たちにはこのような配列があります。この例では、単純化のために、配列に1つのオブジェクトを追加しましたが、それが多数あると仮定しましょう。

$scope.var = [ 
    {name: "John", 
    surname: "Smith", 
    children: [ 

     {name: "Phil", 
      surname: "Smith", 
      children: [ 

       {name: "Peter", 
       surname: "Smith", 
       children: []}, 

       {name: "Joe", 
       surname: "Smith", 
       children: [ 

        {name: "Dirk", 
        surname: "Smith", 
        children: [ 

         {name: "Carl", 
         surname: "Smith", 
         children: []} 
        ] 
        } 
       ] 
       } 
      ] 
     } 
    ] 
    } 
]; 

このように、各オブジェクトには、より多くのオブジェクトで構成された子ども専用のオブジェクトがあります。 あまり概念的には、私が家系をしていて、壮大な壮大な壮大な父と始まったと決めましょう。今度はng-repeatを使ってみんなの名前を表示したい。

nの数を知らなくてもn回繰り返しn回使用できます。どのようにng-repeatを繰り返すのですか？

私はこれについて明らかにした。

はお時間をいただき、ありがとうございます:)

Answer 1

あなたはrecursive ng-repeatを使用する必要があります。

JSFiddle DEMO

説明：最初ng-repeat中

最初のレベルは我々が提供されているテンプレートを含むであろうng-include（categoryTree）を有する同一のタグに、オブジェクトvarに取り込まれます最初のレベル名には、 {{ person.name }}が入力されます。次に、ng-ifが使用されます。これは基本的にレベルに子プロパティが含まれているかどうかをチェックします。 ng-ifに関する重要な情報

ngIfを使用して要素を削除すると、スコープが破棄され、要素が復元されるときに新しいスコープが作成されることに注意してください。 ngIf内で作成されたスコープは、プロトタイプの継承を使用して親スコープから継承されます。これの重要な意味は、ngModelをngIf内で使用して、親スコープで定義されたjavascriptプリミティブにバインドする場合です。この場合、子スコープ内の変数に加えられた変更は、親スコープ内の値を上書き（非表示）します。

上記の行は、同じ変数名（person）を持つ別のng-repeatありng-ifタグの中に、Angular ng-if Documentation

だから私は言いたいことの要点があるから取られた、だから、ng-ifので、新しい作成しました前の変数personはここには存在しないため、新しい変数として扱われます。したがって、反復するdivを取得し、このプロセスは、反復する子がなくなるとng-ifが最終的に壊れるまで続きます。

HTML：

<div ng-controller='MyController' ng-app='myApp'> 
    <li ng-repeat="person in var" ng-include="'categoryTree'"></li> 
</div> 

<script type="text/ng-template" id="categoryTree"> 
    {{ person.name }} 
    <ul ng-if="person.children"> 
     <li ng-repeat="person in person.children" ng-include="'categoryTree'">   
     </li> 
    </ul> 
</script> 

参考文献：http://angular-ui-tree.github.io/angular：

1. AngularJS Recursive Templates