Angular Form Validation With Reactive and Template-Driven Forms

In this tutorial, we’ll explore reactive and template driven-forms in Angular. You’ll see how to create each kind and how to perform validation in Angular 6.

Reactive and Template-Driven Forms

What Are Angular Reactive Forms?

Reactive forms are also known as model-driven forms. This means that the HTML content changes depending on the code in the component.

What Are Angular Template-Driven Forms?

Template-driven forms are driven by derivatives in the template. This means that you will see derivatives such as ngModel in the template as opposed to the code. 

Differences Between Template-Driven and Reactive Forms

  • Template-driven forms use the FormsModule, while reactive forms use the ReactiveFormsModule.
  • Template-driven forms are asynchronous, while reactive forms are synchronous.
  • In template-driven forms, most of the interaction occurs in the template, while in reactive-driven forms, most of the interaction occurs in the component.

Read full tutorial at code.tutsplus