Adding the form model to our HTML view

So far, we have been working behind the scenes in our class to construct our form. The next step is to wire up our form to the view. To do this, we use the same controls that we used to build the form in our code: formGroup, formControl, and formArray.

Open exercise.component.html and add a form tag as follows:

<form class="row" [formGroup]="exerciseForm" (ngSubmit)="onSubmit(exerciseForm)">  

Within the tag, we are first assigning the exerciseForm that we just built in code to formGroup. This establishes the connection between our coded model and the form in the view. We also wire up the ngSubmit event to an onSubmit method in our code (we'll discuss this method a little later).