In this lecture, we are going to create some form controls, a form control is an object that controls
an individual input field for every input field.
In our form, we should have a corresponding form control.
Once again, it's similar to our tab's components.
We had a component for controlling a single tap.
A form control will control a single input field.
We are going to continue working inside the register component class.
We will update the import statement from the Angular Forms package by adding the form control object.
We need to register our inputs by creating a new instance of the form control object.
These new instances must be added inside the object passed into the form group.
Inside this object, the property name will represent the name of the control before we start adding
some controls.
We should check out our form.
We'll need an overview of what we need to register.
Open the register template file.
Inside this template, we have about seven fields there the name, email, age, password, confirm,
password and phone number fields.
Each of these fields should be controlled by our form group.
Go back to the class file.
Let's do the name field together inside the object.
We will add a property called name.
The value for this property will be a new instance of the form control object.
We can't configure the inputs through this object.
The name of the property doesn't need to correspond to the input field.
However, it's easier to connect the two in my mind.
I recommend using names similar to their respective inputs.
Controls are added as key value pairs in the object passed into the constructor function of the form
group class.
We can pass in a default value for our controls by passing in a value to the instance.
We will pass in an empty string.
Users should provide the values for our form.
We don't need to provide default values for every input in our form.
We should add a new instance to the group.
Let's add the rest of our input fields.
I'm going to do that quickly.
In total, there are six properties.
Let's check out the group in the developer tools.
Search for the register component under this component.
We will have our register form group, we can find the controllers for the group by searching for a
property called Controls.
Angular will store the controllers under this property.
Take the time to verify every controller was added to this object in the next lecture.
We will bind our group to the form in the template.