ngModelChange only on blur if there was change

Viewed 10522

I want to only call updateDetail() on the blur event and only if the model has changed. So right now if the user blurs (tabs) out of the input box without making a change it will call updateDetail() and perform unnecessary calculations. Can someone please remove my ignorance?

<input type="text" (ngModelChange)="updateDetail(d)" [ngModelOptions]="{updateOn: 'blur'}" name='detail-monthly-payment'
                            [(ngModel)]="d.periodPayment" />
3 Answers

Use just (change) in place of (ngModelChange)


I think, This issue is no more with Angular5, Please check

WORKING DEMO

check on your function if exist any changes:

updateDetail(event:any){
 if(this.d.periodPayment == event)
    return;
}

I would just store the previous value and compare it with the new one in updateDetail(d) and only do the calculation when they differ.

I don't think using (change)="..." together with ngModel is a good idea. d.periodPayment won't contain the new value yet when updateDetail() is called.

Related