Solution Review: Making a Reactive Form Valid

Learn how to implement validation in Reactive forms.

We'll cover the following

Solution

  1. We start by importing and injecting the ReactiveFormsModule in the app.module.ts file, in line 2 and line 9, respectively.
  2. In the app.component.html file, we configure [formGroup]in line 4, formControlName in line 7 and line 12. Then we display the status of the form validity in line 16.
  3. In our app.component.ts file, we import the FormGroup, FormControl, Validators in line 2.
  4. Inside the constructor in line 13, we configure the FormControl for each field and the validation requirements inside the FormGroup object.

Get hands-on with 1400+ tech skills courses.