web-dev-qa-db-ja.com

Angular 4：setValue formBuilder空の配列

私はそのような反応型を持っています：

_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]
  });
}
_

後でさらにmemesを追加できます。

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

そして、フォームの値を取得すると、次のようになります。

_this.form.controls['memes'].value_-ここに配列があります

しかし、この_this.form.controls['memes'].value_を空の配列に設定する必要がある場合、どうすれば可能ですか？

このように設定した場合：

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

エラーが発生しました：_Must supply a value for form control at index: 0._

私は何を間違っていますか？

javascriptangulartypescriptangular2-formbuilder
8
brabertaser19

いくつかのことを試してみました：reset()、setControl()ですが、配列全体を実際に[]にリセットする唯一の解決策は次のとおりですが、他のオプションは機能しましたが、彼らはフォームグループをそのまま残し、値を空にしました。

だから私がそれを機能させる方法は、フォーム配列を反復し、ループ内のその特定のインデックスを持つ各フォームグループを削除することでした：

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

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

より良い方法がある場合は、提案をお待ちしています！ :)

6
AJT_82

コンストラクターでインスタンス化されたformBuilderサービスでthis.myForm.controls['myFormArray'] = this.formBuilder.array([]);を試してください。

6
Jacob Kochocki

[〜＃〜]フォーム[〜＃〜]

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

1番目の方法

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

2番目の方法

this.form.setControl('blocks', this._formB.array([]));
3
Luis Ricardo Cayetano Herrera

私は同様の問題を抱えていましたが、フォームを更新した後にエラーが表示され、一連の調査と実験に失敗した後、this.myForm.updateValueAndValidityついにトリックを行いました。

1
Sam