Debounce angular 2 with ngModelChange
I have ngModelChange
on textArea
like this:
<ion-textarea placeholder="Type your message here" formControlName="message" [(ngModel)]="message" (ngModelChange)="changing($event)"></ion-textarea>
And now I would like to know where the user is typing on this textArea
or not, so I would like to use debounce with timmer 5000, for example, to see if it prints or not, rather than send every letter it prints, I want to run this event every 5 seconds, how can I implement it?
+3
source to share
2 answers
@Component({
selector: 'my-app',
template: `
<div>
<input type="text" (keyup)='keyUp.next($event)'>
</div>
`,
})
export class App {
name:string;
public keyUp = new Subject<string>();
constructor() {
const observable = this.keyUp
.map(value => event.target.value)
.debounceTime(1000)
.distinctUntilChanged()
.flatMap((search) => {
return Observable.of(search).delay(500);
})
.subscribe((data) => {
console.log(data);
});
}
}
+5
source to share
Build Subject
in your component. In your method, changing
call next
on this question. Then subscribe to your rejection question:
export class MyComponent {
mySubject = new Subject();
contructor(){
this.mySubject
.debounceTime(5000)
.subscribe(val => {
//do what you want
});
}
changing(event){
this.mySubject.next(event.valueFromInput);
}
}
+2
source to share