Wie setze ngModel innerhalb von [a nested] ngFor (Angular rc2)?

Question

Prämisse: Ich habe mehrere Antworten versucht (einschließlich eine, die ich fragte und versehentlich akzeptierte), aber keine funktioniert für mich.

Ich habe eine eingebettete ngFor innerhalb und eine verschachtelte Bindung über ngModel.

Problem: wenn ich ein Element im verschachtelten ngF aktualisieren, wird das entsprechende Element auch in dem anderen verschachtelten ngFor aktualisiert. Beispielcode unten mit Kommentar, was Arbeit und was nicht.

Vorlage

<div *ngFor="let outerObject of outerObjects; let oIndex = index; trackBy: trackByIndex"> 
    {{outerObject.value}} <!-- this works --> 
    <div *ngFor="let innerObject of outerObject.innerObjects; let index = index; trackBy: trackByIndex"> 
      <input [(ngModel)]="outerObject.innerObjects[index]"> <!-- when I change this any innerObjects[i] is updated --> 
    </div> 
</div> 

ts

outerObjects = [ 
    { 
     value = 'x' 
     innerObjects: ['a', 'b', 'c'] 
    }, 
    { 
     value = 'y' 
     innerObjects: ['a', 'b', 'c'] 
    } 
]; 

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

Answer 1

Sie haben einen Syntaxfehler: Sie schreiben müssen [(ngModel)] nicht [(ngModel]) (am Ende der Reihenfolge des Platzes und gewöhnlichen Klammern bemerken).

Nachdem Sie diesen Syntaxfehler behoben und Ihren Code in Angular 2.1.1 ausgeführt haben, scheint er zu funktionieren. Die Datenbindung ist nur auf die entsprechenden outerObject.innerObjects[index]