ANGULAR🔺: What method is used to wire up a FormControl to a native DOM input element in reactive forms?

• Add the string name given to the FormControl to an attribute named controls on the element to indicate what fields it should include.
• Use the square bracket binding syntax around the value attribute on the DOM element and set that equal to an instance of the FormControl.
• Use the formControlName directive and set the value equal to the string name given to the FormControl.
• Use the string name given to the FormControl as the value for the DOM element id attribute.

Answer

Use the formControlName directive and set the value equal to the string name given to the FormControl.

https://angular.io/guide/reactive-forms#creating-nested-form-groups

In reactive forms, you can wire up a FormControl to a native DOM input element by using the "formControlName" directive. The "formControlName" directive is used to bind a FormControl instance to a form control element in the template.

Here's an example of how you can use the "formControlName" directive in a reactive form:

In this example, the "formControlName" directive is used to bind the "name" FormControl instance to the input element in the template. The "formGroup" directive is used to bind the FormGroup instance that contains the "name" FormControl to the form element.

By using the "formControlName" directive, you can access the value of the form control in the component class and respond to changes in the form control's value. This makes it possible to implement custom validation logic, update the form control's value programmatically, and more.