Angular 2 Reactive Forms vs. Template Forms

Question

We are starting a new Angular 2 project and are considering whether to use Reactive Forms or Template Forms. Background reading here: https://angular.io/guide/reactive-forms

As far as I can tell, the biggest advantage of Reactive Forms is that they are synchronous, but we have simple forms, and I don’t think that asynchrony will cause us problems. There seems to be a lot more overhead with Reactive, there is more code on the surface to do the same.

Can someone provide a solid use case when I use Reactive for simpler form templates?

Answer 1

This is a slide of my course on forms at Pluralsight. Some of these points may be controversial, but I worked with a person from the Angular team who developed Forms to make the list.

Answer 2

The advantage of a template-driven design is its simplicity. There will be little code in the controller. Most logic happens in a template. This is suitable for simple forms that do not require much logic for html code.

But each form has a state that can be updated by many different interactions, and up to the application developer to manage this state and prevent its damage. This can be difficult to do for very large forms and can introduce errors.

On the other hand, if more logic is required, testing is often required. Then the jet model driven design offers more. We can perform a single validation of the form validation logic. We can do this by creating an instance of the class, setting some values ​​in the form controls and conducting tests. For complex software, this is absolutely essential for design and maintainability. A design flaw with a reactive model is its complexity.

There is also a way to mix both types of design, but this will have disadvantages of both types.

This is explained with a simple code example for both ways: Introduction to Angular Forms - Driven Template vs Model Driven or Reactive Forms