角度異步驗證器去抖動輸入

Question

我想為我的角形表組編寫一個自定義異步驗證器，jop用於檢查url是否可訪問。 但是如果我從AbstractControl中去掉了更改的值，那么Control在某種程度上總是無效的。 到目前為止這是我的代碼

export class UrlValidator {
static createValidator(http: HttpClient) {
    return (control: AbstractControl) => {
        const url = control.value;

        return http.get(url).pipe(
            throttleTime(1500),
            catchError(err => {
                console.log('err', err);
                if (err.status && err.status === 200) return of(null);
                return of({ input: 'urlError' });
            })
        );
    };
}
}

debouncetime調用此刻沒有任何作用

提前致謝

Answer 1

你可能不得不在驗證器之外去抖。 如果輸入源持續發光，驗證器將被連續調用，在http調用不執行任何操作后放置debounce。

export class UrlValidator {
static controlValue=new Subject()
static createValidator(http: HttpClient) {
    UrlValiator.controlValue.next(control.value)
    return (control: AbstractControl) => {
        return controlValue.pipe(
            debounceTime(1500),
            switchMap(()=>http(url))
            catchError(err => {
                console.log('err', err);
                if (err.status && err.status === 200) return of(null);
                return of({ input: 'urlError' });
            })
        );
    };
}
}

Answer 2

好的問題是，Observable陷入了待決狀態。 向http observable添加.first()可以達到目的