Angular : Can't update values in nested formGroup and formArray

3
votes

I have a formGroup called 'selsectedForm' includes nested arrays, the first level is 'fields' formArray includes the second level which is 'values' formArray.

I saw many examples about nested form arrays and tried to use them but I failed every time.

I couldn't use setValue() or patchValue() methods in these nested arrays to update the formGroup values.

I need to do that to see if the form is touched and valid, and also to update the values for submit.

here is the code: https://stackblitz.com/edit/angular-httakx?embed=1&file=app/app.component.ts

1
angularangular-reactive-formsformarray

1 Answers

1
votes

You can set a debugger in your app and print the form so you can check the fields of the value attribute to set the exact content it needs.

For the addField() function:

last.patchValue({values:['myValue']})

For the addValue(i) function:

var storedValue = values.getRawValue(); storedValue[storedValue.length - 1] = 'value' + i; values.patchValue(storedValue)

For removeValue(i,j):

var storedValue = values.getRawValue(); storedValue[storedValue.length - 1] = ''; values.patchValue(storedValue)

And you don't need anything to remove value when removing the field, just removing the form control.

Hope it helps