Implementing template-driven forms in Angular

Having finished the product details and with routing now in place, let's use Angular's rich support for forms as you go on to implement ProductEditPageComponent.

Angular's team understands that most apps require some level of handling forms, including the following:

• Two-way binding of HTML form elements 
• Field-specific and form-wide validation
• Validation monitoring and user feedback
• Form editing trackability (for example, to determine which fields are pristine, touched, and valid)
• Binding update trigger modes (blur, change, submit, and so on)

Angular provides two key alternatives when handling forms: Reactive-style and template-driven.

The former is generally preferred in the case of nontrivial and somewhat complicated forms, while the latter is usually preferred in simple and static forms.

While there are technical differences between the two, this chapter focuses on using template-driven forms.

First, let's implement the ProductEditPageComponent by adding...