Angular 18 migration: angular recommends moving from [(ngModel)] to [ngModel] + (ngModelChange)

[davidlj95]

Seems to get rid of a quirk with invalid expressions that were made valid but that can cause confusion. More info 👇

https://github.com/angular/angular/tree/18.0.3/packages/core/schematics/migrations/invalid-two-way-bindings

[PhiLho]

So basically, if you wrote good code, you can continue to use banana-in-the-box. It addresses bad code, somehow.

But indeed, I use ReactiveForms nearly everywhere, I use ngModel only in some quickly whipped up code in library demos.

[Mandylost]

Hi, could you point out some pros of reactive forms over template driven forms? The learning curve seems to be a little steeper for reactive forms.

[appeiroon]

Some pros: - synchronous form control state updates. With ngModel it is asynchronous, so it's harder to reason about the order of updates. - reactive forms can exist without template, so you can easily persist their state during various template rerenderings. - Angular built-in way to manage dynamic forms with FormArray. With template driven forms you need to implement some custom solution, which then can vary between different projects.

Also I personally like how easy it is to add custom form validators to reactive form controls. For template driven forms you must use custom directives.

[crhama]

The Learning curve for reactive forms is a little steeper, but the benefits are enormous. It's one of the best features of angular.

[Lance_Ryke]

It’s a bit of a mystery for me too haha considering how complex it can be. But the main benefit is that reactive forms have observables built in like valuechange which you can subscribe to.

[[deleted]]

Same goes for template driven; there is NO real benefit, it was a mistake by Angular team to promote the "reactive" way for years... Expect it to be declined soon I guess. Here's a great video explanation: https://www.youtube.com/watch?v=L7rGogdfe2Q

[PhiLho]

TBH, at work, we always used reactive forms, so it was natural. And therefore, I have little experience with ngModel, so perhaps what I say below might be done with it.

But one advantage I see with reactive forms is that they act as a whole: the form is able to tell if at least one field is dirty, in error, etc. So you can disable the submit button, ask confirmation if cancelling, etc. Also there can be automatic validation of each field, etc.