單個視圖中的多個ng-repeat

Question

我試圖從Web服務中顯示一個由JSON構成的表，然後我創建一個數組。數組長度爲0，當我點擊一個按鈕時，我向數組中添加1個元素，並向表中添加一個新行。當我點擊按鈕不會給我添加數組元素，並且不知道爲什麼。在同一個控制器和視圖上有兩種不同的ng-repeat是可能的？

有控制器：

assets.controller('EditaTipusCtrl', function ($scope, $http, $routeParams) { 
       $http.get('http://10.0.203.73/WS/ws.php/tipusactius/getDetails/' + $routeParams.id).success(function (data) { 
        $scope.atrb = data; 
       }); 

       $scope.nousAtributs = []; 

       $scope.addNewLine = function() { 
        var newRow = { 
         "nomAtribut": "", 
         "tipus": "", 
         "mida": '', 
         "prioritat": "", 
         "obligatori": "", 
         "observacions": "", 
         "nomTipusActiu": $routeParams.id // nom del tipus d'actiu 
        }; 
        $scope.nousAtributs.push(newRow); 
       //  return $scope.nousAtributs; 
       } 

      }); 

和視圖：

<div class="col-md-10"> 
    <div ng-controller="EditaTipusCtrl" id="test"> 
     <div class="row"> 
      <button class="btn btn-default" > 
       <span class="glyphicon glyphicon-plus" aria-hidden="true" ng-click="addNewLine()"></span> 
       Afegir atribut 
      </button> 
     </div> 
     <br /> 
     <table class="table"> 
      <tr> 
       <th>#</th> 
       <th><a href="" ng-click="sortField = 'ordre'; reverse = !reverse">Prioritat</a></th> 
       <th><a href="" ng-click="sortField = 'nomAtribut'; reverse = !reverse">Atribut</a></th> 
       <th><a href="" ng-click="sortField = 'midaAtribut'; reverse = !reverse">Mida</a></th> 
       <th><a href="" ng-click="sortField = 'atributObligatori'; reverse = !reverse">Obligatori</a></th> 
       <th><a href="" ng-click="sortField = 'observacions'; reverse = !reverse">Observacions</a></th> 
      </tr> 
      <tr ng-repeat="(key, value) in atrb"> 
       <td></td> 
       <td> 
        <input type="number" ng-model="value.ordre" value="value.ordre" /> 
       </td> 
       <td> 
        <input type="value.valor" ng-model="value.nomAtribut" value="value.nomAtribut" /> 
       </td> 
       <td> 
        <input type="value.valor" ng-model="value.midaAtribut" value="value.midaAtribut" /> 
       </td> 
       <td> 
        <input type="checkbox" ng-model="value.atributObligatori" value="value.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" /> 
       </td> 
       <td> 
        <input type="value.valor" ng-model="value.observacions" value="value.observacions" /> 
       </td> 
      </tr> 
      <tr ng-repeat="a in nousAtributs"> 
       <td></td> 
       <td> 
        <input type="number" ng-model="a.ordre" value="a.ordre" /> 
       </td> 
       <td> 
        <input type="a.valor" ng-model="a.nomAtribut" value="a.nomAtribut" /> 
       </td> 
       <td> 
        <input type="a.valor" ng-model="a.midaAtribut" value="a.midaAtribut" /> 
       </td> 
       <td> 
        <input type="checkbox" ng-model="a.atributObligatori" value="a.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" /> 
       </td> 
       <td> 
        <input type="a.valor" ng-model="a.observacions" value="a.observacions" /> 
       </td> 
      </tr> 
     </table> 
     <button class="btn btn-default" > 
      <span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span> 
      Guardar 
     </button> 
    </div> 
</div> 

解決：

我把按鈕標籤，而不是span標籤上的NG-點擊

Regards

Answer 1

你的ng-click應該在按鈕標籤中而不是範圍內

Answer 2

我認爲你想要做的事情需要ng-repeat-start和ng-repeat-end。所以你會有;

<tr ng-repeat-start="(key, value) in atrb"> 
    <td></td> 
    <td> 
     <input type="number" ng-model="value.ordre" value="value.ordre" /> 
    </td> 
    <td> 
     <input type="value.valor" ng-model="value.nomAtribut" value="value.nomAtribut" /> 
    </td> 
    <td> 
     <input type="value.valor" ng-model="value.midaAtribut" value="value.midaAtribut" /> 
    </td> 
    <td> 
     <input type="checkbox" ng-model="value.atributObligatori" value="value.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" /> 
    </td> 
    <td> 
     <input type="value.valor" ng-model="value.observacions" value="value.observacions" /> 
    </td> 
</tr> 
<tr style="display:none;" ng-repeat-end></tr> 
<tr ng-repeat-start="a in nousAtributs"> 
    <td></td> 
    <td> 
     <input type="number" ng-model="a.ordre" value="a.ordre" /> 
    </td> 
    <td> 
     <input type="a.valor" ng-model="a.nomAtribut" value="a.nomAtribut" /> 
    </td> 
    <td> 
     <input type="a.valor" ng-model="a.midaAtribut" value="a.midaAtribut" /> 
    </td> 
    <td> 
     <input type="checkbox" ng-model="a.atributObligatori" value="a.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" /> 
    </td> 
    <td> 
     <input type="a.valor" ng-model="a.observacions" value="a.observacions" /> 
    </td> 
</tr> 
<tr style="display:none;" ng-repeat-end></tr> 

請參閱該文檔here