Angular 2 ngModel si associa in nested ngPer

Question

Sto tentando di convertire un'angolare 1 app in Angular 2. In loop attraverso una matrice frastagliata di booleani (boolean[][]). Sto rendendo fuori checkboxes con il seguente codice:

<div *ngFor="#cell of CellData; #parentIndex = index"> 
    <input *ngFor="#col of cell; #childIndex = index" type="checkbox" [(ngModel)]="CellData[parentIndex][childIndex]" />  
</div> 

Il display caselle correttamente, tuttavia, se seleziono una casella di controllo l'uno a destra di esso viene anche selezionato.

Questa logica funziona bene nella angolare 1 app, quindi non sono sicuro se è un problema con il modo in cui sto usando ngModel o un problema con angolare 2.

Qualsiasi aiuto sarebbe molto apprezzato

Answer 1

Aggiornamento

Il modo ufficiale per utilizzare ngForTrackBy sembra essere

 <input 
      *ngFor="let col of cell; let childIndex=index; trackBy:customTrackBy" 
      type="checkbox" 
      [(ngModel)]="CellData[parentIndex][childIndex]" />  

.210

Vedere http://angularjs.blogspot.co.at/2016/04/5-rookie-mistakes-to-avoid-with-angular.html per maggiori dettagli

nota la : in trackBy:customTrackBy

originale

È possibile utilizzare *ngForTrackBy per questo:

@Component({ 
    selector: 'my-app', 
    template: ` 
    <div *ngFor="let cell of CellData; let parentIndex = index"> 
     <input 
      *ngFor="let col of cell; let childIndex = index" type="checkbox" 
      *ngForTrackBy="customTrackBy" 
      [(ngModel)]="CellData[parentIndex][childIndex]" />  
    </div> 

    Data:<br/><br/> 
    {{CellData | json}} 
    ` 
}) 
export class AppComponent { 
    constructor() { 
    this.CellData = [ 
     [ true, false, true, false ], 
     [ false, true, false, true ] 
    ] 
    } 

    customTrackBy(index: number, obj: any): any { 
    return index; 
    } 
} 

angolare di default tracce l'identità dell'oggetto, ma diverso true se false s hanno la stessa identità. Senza *ngForTrackBy Angular perde traccia che true o false è in quale posizione. Con *ngForTrackBy="customTrackBy" facciamo *ngFor utilizzare l'indice anziché l'identità dell'oggetto.

Plunker example

Vedi anche

• https://github.com/angular/angular/issues/4402