web-dev-qa-db-ja.com

FormArray TypeError：value.forEachは関数ではありません

なぜこのエラーが発生し続けるのですか？私はすべてを正しくやっていると思いますか？

"例外：キャッチされていません（約束されています）：TypeError：value.forEachは関数ではありませんTypeError：value.forEachはFormArray.setValueの関数ではありません"

コンポーネントクラス：

jobDetails: FormGroup;
techFormArray: FormArray;

constructor(private formBuilder: FormBuilder){

    this.techFormArray = new FormArray([
        new FormControl(''),
        new FormControl(''),
        new FormControl('')
    ]);
    this.jobDetails = this.formBuilder.group({
        techs: this.formBuilder.array([])
    });
    this.jobDetails.setValue({
        techs: this.techFormArray
    });
}

HTML：

<form [formGroup]="jobDetails">
  <div formArrayName="techs" >
    <div style="display: flex; flex-direction: column">
      <div *ngFor="let tech of techFormArray.controls; let i=index">
        <md-checkbox [formControlName]="i">
          {{i}}
        </md-checkbox>
      </div>
    </div>
  </div>
</form>

解決：

FunStuffはそれを正しく持っていました、私はsetValueを使うことができませんでした....それで私はそれを削除しました。問題は解決しました笑。私はいくつかのことを変更しました、そして私が何をしたのか正確にはわかりません、それは本質的に何時間もブルートフォースの試行錯誤でした、しかしそれはうまくいきました！ :)

これが作業バージョンです！

jobDetails: FormGroup;

constructor(private formBuilder: FormBuilder){

    this.jobDetails = formBuilder.group({
        techs: formBuilder.array([
            formBuilder.control(''),
            formBuilder.control('')
        ])
    });
}

新しいHTML：

    <form [formGroup]="jobDetails">
        <div formArrayName="techs" >
            <div style="display: flex; flex-direction: column">
                <div *ngFor="let tech of jobDetails.controls.techs.controls; let i=index">
                    <md-checkbox [formControlName]="i">
                        {{i}}
                    </md-checkbox>
                </div>
            </div>
        </div>
    </form>
angularformbuilder
5
Jus10

setValueメソッドは単純な値を取ります：

   this.techFormArray = new FormArray([
        new FormControl(''),
        new FormControl(''),
        new FormControl('')
    ]);

    this.jobDetails = this.formBuilder.group({
        techs: this.techFormArray
    });

    this.jobDetails.setValue({
      techs: ['a', 'b', 'c']
    });
9
Bazinga

コンストラクターでこれを行っているので。それ以外の場合は、FormArrayを空にすることを検討する必要があります。

this.techFormArray.forEach((item, idx) => this.jobDetails.get('techs').setControl(idx, item));
0
Petri Ryhänen