Exercise: The Built-in `NgModel` Directive

Let’s practice working with an `NgModel` directive.

We'll cover the following

Let’s test what we’ve learned and create a template-driven form using only a NgModel!


To begin, complete the implementation of provided form. This form allows users to be registered the application. It consists of two inputs for name and email, and one checkbox for some sort of agreement. The task is to hook it up with the component’s logic to get all the data using the NgModel directive.

Use the following to complete this task:

  • Two-way data binding to handle name control.

  • One-way data binding to handle email control and log the value of the email with each change in the console.

  • An NgModel of your choice for the checkbox.

Those three things listed above are needed to log in to the console’s data using all three form controls once the button has been clicked. To view logs, use the browser developer console.


Please write the code below:

Get hands-on with 1200+ tech skills courses.