How to add debounce time to an async validator in angular 2?

by

Angular 4+, Using Observable.timer(debounceTime) :

@izupet ‘s answer is right but it is worth noticing that it is even simpler when you use Observable:

emailAvailability(control: Control) {
    return Observable.timer(500).switchMap(()=>{
      return this._service.checkEmail({email: control.value})
        .mapTo(null)
        .catch(err=>Observable.of({availability: true}));
    });
}

Since angular 4 has been released, if a new value is sent for checking, Angular unsubscribes from Observable while it’s still paused in the timer, so you don’t actually need to manage the setTimeout/clearTimeout logic by yourself.

Using timer and Angular’s async validator behavior we have recreated RxJS debounceTime.

Leave a Comment

tech