How to use onBlur event on Angular2? Ask Question

Use (eventName) while binding event to DOM, basically () is used for event binding. Also, use ngModel to get two-way binding for myModel variable.

Markup

<input type="text" [(ngModel)]="myModel" (blur)="onBlurMethod()">

Code

export class AppComponent { 
  myModel: any;
  constructor(){
    this.myModel = '123';
  }
  onBlurMethod(){
   alert(this.myModel) 
  }
}

<input type="text" [ngModel]="myModel" (ngModelChange)="myModel=$event">

<input type="text" #input (blur)="onBlurMethod($event.target.value)">

ctrl = new FormControl('', {
   updateOn: 'blur', //default will be change
   validators: [Validators.required]
});