Ignat Ignat - 3 months ago 203
Javascript Question

How to use onBlur event on Angular2?

How do you detect an onBlur event in Angular2?
I want to use it with

<input type="text">


Can anyone help me understand how to use it?

Answer

Use (eventName) for 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) 
  }
}

Demo

Alternative(not preferable)

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

Demo

Comments