ng-repeat - conteggio all'interno del loop HTML

Question

C'è comunque un conto per contare un oggetto, quindi visualizzarlo al di fuori del loop?

<tr ng-repeat="value in values"> 
    <td>value.total</td> 
</tr> 
<tr> 
    <td>Total Of All Values: {{ total }}</td> 
</tr> 

Ho provato con ng-init() o nessun successo come penso che sia finita a cavallo ogni volta.

<tr ng-repeat="value in values"> 
    <td ng-init="total = total + value.total>value.total</td> 
</tr> 
<tr> 
    <td>Total Of All Values: {{ total }}</td> 
</tr> 

C'è comunque qualcosa da fare qui, senza fare una funzione nel mio controller?

Answer 1

total che viene inizializzato in ng-repeat sarà di una portata diversa e non possono essere accessibile all'esterno del ciclo.

Prova questa:

<table ng-init="total = 0"> 
<tr ng-repeat="value in values"> 
    <td ng-init="$parent.total = $parent.total + value.total">{{value.total}}</td> 
</tr> 
<tr> 
    <td>Total Of All Values: {{ total }}</td> 
</tr> 
</table> 

Answer 2

È possibile utilizzare la notazione $ gen per accedere a una variabile $ scope (dall'esterno ng-repeat) nell'ambito ng-repeat. Quindi ora, dopo l'inizializzazione, calcolerà il totale e lo memorizzerà nella variabile $ scope che è stata inizializzata all'esterno.

Codice:

<div ng-app ng-controller="test"> 
    <table ng-init="total=0;"> 
     <tr ng-repeat="value in values"> 
      <td ng-init="$parent.total = total + value">{{value}}</td> 
     </tr> 
     <tr> 
      <td>Total Of All Values: {{ total }}</td> 
     </tr> 
    </table> 
</div> 

Working Fiddle

Answer 3

Anche se sembrano essere simili ngRepeat non funziona come un loop for in un linguaggio di programmazione imperativa. La direttiva ngRepeat consiste di due passaggi che vengono eseguiti separatamente. Innanzitutto, produce una matrice/una mappa con i valori di ripetizione. In secondo luogo, esegue il rendering del modello (gli elementi all'interno dell'elemento con ngRepeat) per ciascun valore di ripetizione. Tuttavia, non esegue iterazioni su un blocco di codice come un linguaggio di programmazione imperativo.

Anche se è possibile ottenere ciò che si tenta di fare con $parent.total, è possibile che si verifichino altre insidie ​​con questa soluzione non appena i contenuti della matrice cambiano. Per farla breve, dovresti piuttosto trovare un altro modo per riassumere i valori nella matrice.

A mio parere, il posto migliore per riassumere i valori è il controllore con una linea come questa:

$scope.total = values.reduce(function (a,b) {return a+b}); 

Answer 4

Si può sempre fare questo nella funzione JS.

 $scope.values = data; 
     angular.forEach($scope.values,function(value){ 
      $scope.total += value.value; 
     }); 

plunker di lavoro: http://plnkr.co/edit/5WZ9alCXzq115wi3xl4B?p=preview