Implementing complex forms with reactive FormArray

This is definitely one of the most requested recipes from the readers of the first edition of Angular Cookbook. In this recipe, we’ll work with reactive Forms and specifically, the FormArray class from reactive forms. We’re going to implement a complex form, which has a list of projects that can be submitted with reactive forms. The user will be able to add as many projects as they want and will be able to remove the ones they don’t want.

Getting ready

The app that we are going to work with resides in start/apps/chapter08/ng-form-arrays inside the cloned repository:

1. Open the code repository in your code editor.
2. Open the terminal, navigate to the code repository directory, and run the following command to serve the project:

   npm run serve ng-form-arrays
   

   This should open the app in a new browser tab, and you should see the following:

   

   Figure 8.15: reactive FormArray...