Асинхронный валидатор заставляет статус формы оставаться в состоянии ожидания
РЕДАКТИРОВАТЬ: карта переключения кажется виновником. При его удалении статус моей формы больше не остается в состоянии ожидания. Кто-нибудь может объяснить это?
Я использую следующую фабрику для создания асинхронных валидаторов для моих форм:
export function createAsyncValidator(checkFn: (value: string) => Observable<Boolean>, errorMessage: string) {
return (control: AbstractControl): Observable<ValidationErrors> => {
return Observable.timer(500).switchMap(() => {
return checkFn(control.value)
.map(result => {
return result ? null : { [errorMessage]: true };
});
});
};
}
Я добавляю его в мою форму следующим образом:
createAsyncValidator(this.asyncValidator, 'Error')
Реализация валидатора (пример):
asyncValidator = (value: string): Observable<Boolean> => {
if (value === 'test') {
return Observable.of(true); // THIS CAUSES THE FORM TO BE PENDING
}
return this.http.get('url/' + value, true); // THIS WORKS
};
Когда мой асинхронный валидатор использует http-вызов для проверки моего ввода, все работает как положено. Однако, если я вернусь с Observable.of(true), вся форма останется в ОЖИДАНИИ
После некоторого исследования я понял, что моя наблюдаемая не является полной, и, следовательно, состояние ОЖИДАЕТ. Как я могу вернуть наблюдаемое, которое завершается?
1 ответ
Замена switchMap на flatMap решает мою проблему:
export function createAsyncValidator(checkFn: (value: string) => Observable<Boolean>, errorMessage: string) {
return (control: AbstractControl): Observable<ValidationErrors> => {
return Observable.timer(500).flatMap(() => {
return checkFn(control.value)
.map(result => {
return result ? null : { [errorMessage]: true };
});
});
};
}