how to trigger ngmodelchange after typing is finished

Solutions on MaxInterview for how to trigger ngmodelchange after typing is finished by the best coders in the world

showing results for - "how to trigger ngmodelchange after typing is finished"
Emilia
10 Sep 2017
1import { Component } from '@angular/core';
2import { NgZone } from '@angular/core';
3
4@Component({
5  selector: 'my-app',
6  template: `
7   <h4>Type something in below text box</h4>
8   <input (ngModelChange)="displayName()" [(ngModel)]="name"/>
9   <h4>Value : {{name1}} </h4>
10  `
11})
12export class AppComponent {
13   name: string = '';
14   name1: string = '';
15   _timeout: any = null;
16
17   constructor(public lc: NgZone) {
18
19   }
20
21   displayName() {
22     this._timeout  = null;
23     if(this._timeout){ //if there is already a timeout in process cancel it
24       window.clearTimeout(this._timeout);
25     }
26     this._timeout = window.setTimeout(() => {
27        this._timeout = null;
28        this.lc.run(() => this.name1 = this.name);
29     },1000);
30  }
31}
32