AsyncValidatorFn Angular 7

.ts

import { AbstractControl, AsyncValidatorFn, ValidationErrors } from '@angular/forms';
import { UserService } from '../services/user.service';
import { Observable } from 'rxjs/Observable';
import { catchError, map, switchMap } from 'rxjs/operators';
import { of, timer } from 'rxjs';

export function uniqueUsernameValidator(userService: UserService): AsyncValidatorFn {
	return (control: AbstractControl): Observable<ValidationErrors | null> => {
    return timer(500).pipe(switchMap(() => {
			if (!control.value) {
				return of(null);
			}

			return userService.isUsernameUnique(control.value).pipe(
				map(isUnique => (isUnique ? null : {usernameNotUnique: true})),
				catchError(() => null)
			);
		}));
	};
}