dcp3450
dcp3450

Reputation: 11187

Nested FormGroup resets all groups

I have a FormGroup with nested groups:

this.addComponentForm = this.fb.group(
      {
        'initialValues': this.fb.group({...this.initialFormValues, ...this.dynamicFormValues, ...this.phaseFormValues}),
        'dynamicValues': this.fb.group({...this.dynamicFormValues})
      }

To get the nested groups (per the docs):

  get initialValues(): any { return this.addComponentForm.get('initialValues'); }
  get dynamicValues(): any { return this.addComponentForm.get('dynamicValues'); }

All this works fine thus far, forms build, no errors. I have an action that need to only clear the initialValues formgroup: this.initialValues.reset(); However, the data in this.dynamicValues is also getting set to null. Commenting out the reset clears nothing so I know this is where things are getting cleared in both groups.

I tried this.initialValues.reset({onlySelf: true}); but nope.

Upvotes: 0

Views: 306

Answers (1)

Severin Klug
Severin Klug

Reputation: 754

Oh dear. You're using the spread operator to copy the dynamicValues into initialValues.

Upvotes: 1

Related Questions