RxJS：catchError返回union类型

Question

I mean, catchError returns an Observable union type: Observable<{} | Page} Observable<{} | Page} instead of Observable<Page> .

I'm getting this compiler message:

Type 'Observable<{} | Page>' is not assignable to type 'Observable<Page>'.
  Type '{} | Page' is not assignable to type 'Page'.
    Type '{}' is missing the following properties from type 'Page': total, audits

Related code is:

public searchFromStorageByCriteria(filter: Query): Observable<Page> {
    const buildPage = () => map((response: Response) => this.buildPage(response));
    const onErrorEmptyPage = () => catchError(() => Observable.of(Page.EMPTY));

    let url:string = this.buildURL(user, app, filter);
    return this.authHttp.get(url)
        .pipe(
            buildPage(),
            onErrorEmptyPage()
        );
}

The problem is located on catchError since:

export declare function catchError<T, R>(selector: (err: any, caught: Observable<T>) => ObservableInput<R>): OperatorFunction<T, T | R>;

As you can see it's returning an : OperatorFunction<T, T | R> : OperatorFunction<T, T | R> and also caught: Observable<T> .

Page.EMPTY is:

export class Page {
    readonly total: number;
    readonly audits: Array<Audit>;

    public static EMPTY:Page = {total: 0, audits: []};
}

Any ideas?

Answer 1

The solution is about overriding catchError signature:

catchError<Page, never>

Take a look on never type .