Angular 4: setValue Formbuilder leeres Array

Question

Ich habe solche reaktive Form:

constructor(...){ 
    this.form = this.formBuilder.group({ 
    name: ['', Validators.compose([Validators.required, Validators.maxLength(50)])], 
    memes: this.formBuilder.array([ 
     this.initMemes('TrollFace') 
    ]) 
    }); 
} 

initMemes (name?) { 
    return this.formBuilder.group({ 
    id: [''], name: [name] 
    }); 
} 

später kann ich einige weitere hinzufügen memes:

addMemes() { 
    const control = <FormArray>this.form.controls['memes']; 
    control.push(this.initMemes('anyName')); 
} 

und dann, wenn ich Form Werte bekomme ich erhalten:

this.form.controls['memes'].value - hier habe ich Array

Aber es gibt einen Fall, wenn ich diesebraucheauf ein leeres Array zu setzen, wie ist es möglich, zu tun?

Wenn ich stellte es auf diese Weise:

this.form.controls['memes'].setValue([])

ich eine Fehlermeldung anzeigt: Must supply a value for form control at index: 0.

, was ich falsch gemacht?

Answer 1

versucht, ein paar Dinge: reset(), setControl(), aber die folgenden war die einzige Lösung, die ich eigentlich arbeiten festgestellt, dass das gesamte Array setzt auf [] arbeiteten andere Optionen, aber sie verließen die formgroups an Ort und Stelle, nur die Werte geleert.

So, wie ich es zu arbeiten, war die Form Array zu durchlaufen und jede Form Gruppe mit diesem bestimmten Index in der Schleife löschen:

const control = <FormArray>this.form.controls['memes']; 

for(let i = control.length-1; i >= 0; i--) { 
    control.removeAt(i) 
} 

Wenn es ein besserer Weg, ich bin offen für Vorschläge! :)

Answer 2

Versuchen Sie this.myForm.controls['myFormArray'] = this.formBuilder.array([]); mit FormBuilder-Dienst instanziiert in Ihrem Konstruktor.

Answer 3

Ich hatte ein ähnliches Problem, wo ich Fehler nach der Aktualisierung meines Formulars erhalten würde, und nach einer Reihe von Untersuchungen und gescheiterten Experimenten fand ich, dass this.myForm.updateValueAndValidity endlich den Trick gemacht.

Answer 4

FORM

this.form = this._formB.group({ 
    blocks: this._formB.array([]) 
}); 

1. Methode

let fArray = <FormArray>this.form.controls['blocks']; 
while (fArray.length !== 0) { 
    fArray.removeAt(0) 
} 

2. Methode

this.form.setControl('blocks', this._formB.array([]));