AngularJSでいくつかの表のセルを追加する

Question

表のセルを作成するためにAngular.jsとng-repeatを使用しています。誰かが私に説明でき

<tr ng-repeat="item in items" > 
    <td>{{item.name}}</td> 
    <td ng-repeat="another_item in item.value">{{another_item.val1 + another_item.val2}}</td> 
</tr> 

、なぜTDを有する第二の構造は、2個のタグを生成します

$scope.items = [{ name: 'item1', value: [{ val1: '1' }, { val2: '2' }] }, 
       { name: 'item2', value: [{ val1: '3' }, { val2: '4' }] ] 

、ここでは私のマークアップです：私は、オブジェクトの配列を持っています。この場合、プラスでどのように動作しますか？{{another_item.val1 + another_item.val2}}

ありがとうございます。

Answer 1

ngRepeatを配列全体に繰り返し、すべての値に対してdomに要素を追加します。それはなるように、

<tr ng-repeat="item1" > 
    <td>{{item1.name}}</td> 
    <td ng-repeat="another_item in item2.value">{{another_item.val1 + another_item.val2}}</td> 
</tr> 

<tr ng-repeat="item2" > 
    <td>{{item2.name}}</td> 
    <td ng-repeat="another_item in item2.value">{{another_item.val1 + another_item.val2}}</td> 
</tr> 

インナーNG-繰り返し同じことを：：

<tr ng-repeat="item1" > 
    <td>{{item1.name}}</td> 
    <td ng-repeat="firstIndex">{{firstIndex.val1 + firstIndex.val2}}</td> 
    <td ng-repeat="secondIndex">{{secondIndex.val1 + secondIndex.val2}}</td> 
</tr> 

<tr ng-repeat="item2" > 
    <td>{{item2.name}}</td> 
    <td ng-repeat="firstIndex">{{firstIndex.val1 + firstIndex.val2}}</td> 
    <td ng-repeat="secondIndex">{{secondIndex.val1 + secondIndex.val2}}</td> 
</tr> 

それが動作しない理由を参照してください、あなたの場合は

は、項目を繰り返し処理すると、次が追加されますか？ firstIndexにはval1しかないので、val2での追加に失敗します。 secondIndexの反対側です。