Modifying forms dynamically

So far, we have used the FormGroup and FormControl classes extensively throughout this chapter. However, we have not seen what FormArray is all about.

Suppose that we would like to enable the form of HeroComponent so that it allows us to add some powers to our hero. After all, superheroes are all about having special powers, aren't they? A hero can have more than one superpower, so let's modify the heroDetails form accordingly:

1. Add a powers property to the heroDetails form group and set its value to an instance of the FormArray class. The constructor of the FormArray class accepts a list of FormControl instances as a parameter. For now, the list is empty since the hero does not have any powers initially:

   heroDetails = new FormGroup({
     name: new FormControl(''),
     realName: new FormControl(''),
     biometricData: new FormGroup({
     &...