2016-12-01 4 views
7

Ist es Es sieht aus wie Angular2 FormGroup.patchValue() nicht neue Elemente in ein Array schieben.Angular2 patchValue Push-Wert in Array

Zum Beispiel so etwas wie diese:

ngOnInit() { 

    this.form = this.formBuilder.group({ 
     animal: [''], 
     school: this.formBuilder.group({ 
      name: [''], 
     }), 
     students: this.formBuilder.array([this.formBuilder.control('Bob')]) 
    }); 

    setTimeout(() => this.form.patchValue({ 
     animal: 'cat' 
     school : {name: 'Fraser'}, 
     students: ['Bob gets edited', 'This will not show'] 
    }), 250); 

} 

Werden nur Update das erste Element in "Studenten", aber es wird nicht das zweite Element einzufügen.

Was müsste ich tun, damit beide Elemente angezeigt werden?

Plunker here.

Antwort

4

.patchValue() aktualisiert nur die vorhandene FormArray, es wird nicht die Struktur Ihres Formularmodells ändern.

patchValue (value: any [], {onlySelf, emitEvent} {?: onlySelf ?: boolean, emitEvent ?: boolean}): void Patches der Wert des FormArray. Es akzeptiert ein Array, das der Struktur des Steuerelements entspricht, und tut sein Bestes, um die Werte den richtigen Steuerelementen in der Gruppe zuzuordnen.

Er akzeptiert sowohl Super-Sets als auch Sub-Sets des Arrays, ohne einen Fehler zu werfen.

Sie müssen tatsächlich Push ein neues Element auf das Array, um es zu erscheinen.

this.form.controls['students'].push(new FormControl('This will not show')); 

Das ist alles in der FormArray Dokumentation https://angular.io/docs/ts/latest/api/forms/index/FormArray-class.html

+1

Wie ist es möglich, wie viele Formular-Steuerelemente zu wissen, im Voraus zu schieben? – kostia

+0

Gute Frage @ Kostia. Könntest du das herausfinden? – MeMeMax

8

Nun, wie silentsod gesagt, es ist nicht möglich. Derzeit verwende ich unten als Alternative:

 let controlArray = <FormArray>this.form.controls['apps'];   
     this.list.forEach(app => { 
        const fb = this.buildGroup(); 
        fb.patchValue(app); 
        controlArray.push(fb); 
      }); 

Angular Team - Wir brauchen eine neue Funktion so etwas wie PatchArray(), die aus einer Sammlung/Objektgraph-Patch würde. Es ist ein grundlegender Anwendungsfall.

-1

Nun, ich die Lösung fand heraus ist:

this.myForm.controls['array'] = this.formBuilder.array(newArray.map(i => this.formBuilder.group(i))); 
Verwandte Themen