Building reactive forms

In this section, you will learn how to build reactive forms. We will rebuild the form we used in the previous section but reactively. You will learn how to create FormGroup, FormArray, and FormControl instances, how to validate reactive forms, and how to create custom validators for reactive forms. You will also learn how to dynamically create form fields and how to change the update behavior of reactive form fields.

Creating a reactive form

Start by removing or commenting out the HTML template and TypeScript code for our template-driven form. I will comment out the code so that it remains an example of the template-driven approach.

Next, we’ll start with the same simple HTML form, including the description, amount excluding VAT, VAT percentage, and date fields. We will gradually transform the simple HTML form into a reactive form:

<form>
  <div class=»form-field">
    <label for=»...