Iterate Angular 2+ FormArray

BBaysinger picture BBaysinger · Mar 20, 2018 · Viewed 27k times · Source

I have a FormArray, and need to iterate through each of its members.

I see there is a get method in the docs, but I don't see where to get the keys, or even the length.

How do I iterate a FormArray?

Answer

AlesD picture AlesD · Mar 21, 2018

You have a property controls in FormArray which is an array of AbstractControl objects. Check the specific documentation for FormArray and you will see they also inherit from AbstractControl like the FormControl you posted.

Be aware that in the controls array you can have again inside FormArray or FormGroup objects besides FormControl objects because there can be nested groups or arrays.

Here is simple example:

for (let control of formArray.controls) {
   if (control instanceof FormControl) {
      // is a FormControl
   }
   if (control instanceof FormGroup) {
      // is a FormGroup  
   }
   if (control instanceof FormArray) {
      // is a FormArray
   }
}