iterazione della cella di tabella Angularjs

Question

Ho la sensazione che sto facendo qualcosa di sbagliato, ma questo comportamento sembra strano. Creo dinamicamente una tabella in base ai dati nel controller. Quando inserisco un personaggio in una delle celle nella tabella, immediatamente si sposta lo stato attivo sulla cella successiva e si aggiunge anche il carattere.

Ho un esempio molto semplice che riproduce il problema in jsfiddle.

http://jsfiddle.net/rgaskill/Aksec/15/

<div ng-app="miniapp"> 
<div ng-controller="Matrix"> 
    <h1>Enter a value in the fist cell.</h1> 
    <table> 
<thead> 
    <tr> 
     <th>Row Name</th> 
     <th>0</th> 
     <th>1</th> 
     <th>2</th> 
     <th>3</th> 
     <th>4</th> 
     <th>5</th> 
    </tr> 
</thead> 
<tbody> 
    <tr ng-repeat="(row, values) in valueMap"> 
     <td>{{row}}</td> 
     <td ng-repeat="(col, val) in values" ><input type="text" ng-model="valueMap[row][col]"></input></td> 
    </tr> 

</tbody> 
</table>      
</div>  
</div>​ 

---

var app = angular.module('miniapp', []); 

function Matrix($scope) { 
$scope.valueMap = { 
    aRow: { 
     '0': '', 
     '1': '', 
     '2': '', 
     '3': '', 
     '4': '', 
     '5': '' 
    } 
    }; 
}​ 

cosa sta causando questo strano comportamento?

Answer 1

Ok, ho trovato il problema. Questo post ha aggiunto una certa chiarezza.

https://groups.google.com/forum/#!topic/angular/VD77QR1J6uQ/discussion

quando il ngRepeat srotola si copia il primitivo in un ambito locale alla voce. Quindi il modello ng si lega ad esso. Quando aggiorni il modello, stai aggiornando una copia, non l'originale. ma quando si aggiorna l'originale, il ripetitore si coagula per rendersi conto che qualcosa è cambiato nell'array degli elementi e quindi ricrea il modello-ng, il che significa che ti ri-copia sugli oggetti. Da qui lo strano comportamento ma è previsto.

Risposta breve: non iterare e si legano input per primitive in ngRepeat, come si sta facendo una copia del valore piuttosto il riferimento e gli eventuali aggiornamenti vengono scritti ambito locale piuttosto che nella posizione originale.

e ho aggiornato il violino, che ora funziona

http://jsfiddle.net/rgaskill/Aksec/16/