Using forms, in general, is our way of collecting data from the web so we can later persist it. We have expectations of the form experience, such as:

• Easily being able to declare different kinds of input fields
• Setting up different kind of validations and displaying any validation errors to the user
• Supporting different strategies for stopping a post submission if the form contains errors

There are two approaches to handling forms: template-driven forms and reactive forms. Neither approach is considered better than the other; you just have to go with the one that suits your scenario the best. The major difference between the two approaches is who is responsible for what:

• In the template-driven approach, the template is responsible for creating elements, forms, and setting up validation rules, and synchronization happens with two-way data binding
• In the reactive approach, the Component class is responsible for creating the form, its elements, and setting up the validation.

In this chapter, we will:

• Learn about template-driven forms
• Bind data models and interface types for forms and input controls
• Design forms using the reactive forms approach
• Dive into the alternatives for input validation
• Build our own custom validators