Angular 2 dynamic form binding funktioniert nicht

Question

Ich erstelle ein dynamisches Formular mit Angular 2 (oder 4) mit einem Formular-Array (Räume) Verschachtelung eines Formular-Array (Kinder).

Das untergeordnete Array bindet Steuerelemente und Werte in der Formulareigenschaft .value nicht, auch wenn sie hinzugefügt werden.

Hier die plunkr: https://embed.plnkr.co/DjtLLt0vS0qmmvgqKhN8/

Was ich vermisse?

Answer 1

Sie haben einen einfachen Fehler, entfernen Sie das letzte controls von Ihrem addChild():

addChild(i: number) { 
    const control = 
     //remove the last 'controls' 
     this.searchform.controls.rooms).controls[i]).controls["children"].controls; 
    control.push(this.initAge()); 
} 

und statt:

addChild(i: number) { 
    const control = 
     this.searchform.controls.rooms).controls[i]).controls["children"]; 
    control.push(this.initAge()); 
} 

Hier ist Ihr gegabelt Plunker: https://plnkr.co/edit/SmnjBroGHufori1PWNSR?p=preview