代码之家  ›  专栏  ›  技术社区  ›  Gatschet

可观察到。map setTimeout函数,返回类型为angular 5

  •  1
  • Gatschet  · 技术社区  · 7 年前

    我想在可观察的范围内稍等一下。映射函数,然后返回值

    我的代码是:

    public loginRequest(userCredentials: any): Observable<TSUser | undefined> {
    
        return this.http.post<TSUser>(this.serviceURL + '/login', userCredentials).map((response: any) => {
    
            window.setTimeout(() => {
                this.initWithCookie();
                return this.principal;
            }, 300);
            //error TS2322: Type 'Observable<void>' is not assignable to type 'Observable<TSUser | undefined>'. Type 'void' is not assignable to type 'TSUser | undefined'.
    
        });
    
    };
    

    如何使用setTimeout函数返回正确的可观察类型。用我的代码我得到了错误 error TS2322: Type 'Observable<void>' is not assignable to type 'Observable<TSUser | undefined>'. Type 'void' is not assignable to type 'TSUser | undefined'.

    如果我使用:

    public loginRequest(userCredentials: any): Observable<TSUser | undefined> {
    
        return this.http.post<TSUser>(this.serviceURL + '/login', userCredentials).map((response: any) => {
    
            return Observable.timer(300).map(() => {
                    this.initWithCookie();
                    return this.principal;
                }).take(1);
        });
    
    };
    

    我得到了错误 error TS2322: Type 'Observable<Observable<TSUser | undefined>>' is not assignable to type 'Observable<TSUser | undefined>'.

    解决方案 根据martin的回答,我的工作代码是

    public loginRequest(...): Observable<TSUser | undefined> {
    
            return this.http.post<TSUser>(...).delay(300).concatMap(response => Observable.of(this.initWithCookie()));
    
    };
    

    (我想等300毫秒 之前 我在函数中执行代码)

    2 回复  |  直到 7 年前
        1
  •  3
  •   martin    7 年前

    更容易不用 setTimeout 让RxJS用 delay() 操作员:

    return this.http.post<TSUser>(...)
      .concatMap(response => Observable.of(response).delay(300));
    

    你可以使用 设置超时 但你必须使用 Observable.create(observer => {}) 并在内部发出结果 设置超时 observer.next(...) 这是不必要的复杂。

        2
  •  0
  •   Learning    6 年前

    使用RxJS v6,操作符的导入和使用语法已经更改。

    import { of } from 'rxjs';
    import { delay, concatMap } from 'rxjs/operators';
    
    return of({delay_time: 3000}).pipe(
      concatMap(response => of('Delayed by: ' + response.delay_time + ' ms').pipe(delay(response.delay_time)))
    );