ngModel and change method on input does not work

Question

I have the following HTML template

<input type="text" [(ngModel)]="mobile" (change)="mobileChanged()">

Here is my .ts

mobileChanged = () => {
    console.log(this.mobile);
};

Is it wrong to have ngModel and change in the same element? In my case mobileChanged is not being called while I type in the input. How ever, when I check the value of mobile, it is updated correctly.

This is Angular 7.

Answer 1

Using change will trigger the mobileChanged() when you lose the focus of the input field (ex: Click outside the field). If you want to trigger mobileChanged() while typing, use (ngModelChange)="mobileChanged($event)" instead.