angular - Varför triggas ngModelChange-händelsen varje gång man fokuserar in och ut ur inmatningsrutan?

exempel.html

<input #gb type="text" pInputText class="ui-widget ui-text" [(ngModel)]
="filterText"  (ngModelChange)="filterText = $event; clearFilter(filterText)"/>

komponent.ts

 clearFilter(value) {
                alert(value);// values is empty
            }

Denna varning kommer att utlösas vid varje fokus (in | ut) på inmatningsfältet. Jag vill köra funktionen om modellobjektet har några ändringar.

Hur hanterar man det och varför utlöses ngModelChange-händelsen när man fokuserar in och ut ur inmatningsrutan?

Svar #1

Eftersom deras arbete är att hantera ändringar i textrutan har du fokus- och blur-metoder

<input #gb type="text" pInputText class="ui-widget ui-text" 
  [(ngModel)] ="filterText" 
  (ngModelChange)="clearFilter(filterText)"
  (blur)="clearFilter($event)"
  (focus)="clearFilter($event)"/>

LIVE DEMO

Uppdatering baserad på kommentar

Eftersom du använder [(ngModel)] och (ngModelChange) utlöses det.

Svar #2

Lösningen är trackBy om ngModel-värdet ändras när du använder *ngFor

Demo här: https://stackblitz.com/edit/angular-zwnges?file=app%2Fapp.component.html

Relaterade artiklar