Patch value to multiple formArray in Angular reactive forms

Question

Not able to patch multiple formArray in a formGroup.

Form

 this.usersForm = this.fb.group({
      users: this.fb.array([
        {
          firstName: [""],
          lastName: [""],
        }
      ]),
      work: this.fb.array([
        {
          workType: [""],
          workTitle: [""],
        }
      ]),
    });

I have multiple formArray like these, how to patchValue to it. I tried the below approach but it makes the code too redundant

const formArray = new FormArray([]);

    data.work.forEach((s) => {
      formArray.push(
        this.fb.group({
          workType: s.workType,
          workTitle: s.workTitle,
        })
      );
    });

this.usersForm.setControl("work", formArray);

rahul tiwari rahul tiwari · Accepted Answer · 2020-07-17T14:07:12

//get form array control
let a = this.usersForm.get('work') as FormArray;

// push control in above form array
a.push(this.fb.group({
      workType: 'workType value',
      workTitle: 'workTitle value'
});

or if you want to use patchValue then

this.usersForm.patchValue(your json);

Patch value to multiple formArray in Angular reactive forms

1 Answers