angular - 如何使用 RXJS 5.5.2 更新更好地捕获/执行/清空

Question

如 ionic-angular 3.9.0 发行说明 (https://github.com/ionic-team/ionic/blob/master/CHANGELOG.md) 所述，利用更新到 RXJS 5.5.2 的优势可以减少包大小，从而缩短启动时间

酷，酷，酷:)

Ionic 提供的示例，例如迁移 debounceTime 非常清楚，我明白了。

但我不太清楚我应该如何更新我的以下代码以充分利用此 RXJS 更新。

任何人都可以帮助我转换它或如何更好地编写它以节省包大小？

 import {Observable} from 'rxjs/Observable';
 import 'rxjs/add/observable/empty';
 import 'rxjs/add/operator/do';
 import 'rxjs/add/operator/catch';

 intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    return next.handle(req).do((event: HttpEvent<any>) => {
        if (event instanceof HttpResponse) {
            // do stuff with response if you want
        }
    }).catch((err: HttpErrorResponse) => {
        if ((err.status == 400) || (err.status == 401)) {
            this.interceptorRedirectService.getInterceptedSource().next(err.status);
            return Observable.empty();
        } else {
            return Observable.throw(err);
        }
    })
}

P.S.:链接帖子 https://forum.ionicframework.com/t/how-to-better-catch-do-empty-with-rxjs-5-5-2-updates/111559

Answer 1

我提出了以下更新后的代码，它仍然有效(经过测试)。

import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/empty';
import {tap} from 'rxjs/operators/tap';
import {catchError} from 'rxjs/operators/catchError';

intercept(req: HttpRequest<any>, next: HttpHandler):   Observable<HttpEvent<any>> {

       return next.handle(req).pipe(
        tap((event: HttpEvent<any>) => {
            if (event instanceof HttpResponse) {
                // do stuff with response if you want
            }
        }),
        catchError((err: HttpErrorResponse) => {
            if ((err.status == 400) || (err.status == 401)) {
                this.interceptorRedirectService.getInterceptedSource().next(err.status);
                return Observable.empty();
            } else {
                return Observable.throw(err);
            }
        })
    );
}

注意:

• 必须使用完整的导入路径导入可让运算符以减小包大小

  好:从'rxjs/operators/catchError'导入{catchError}；错误:从 'rxjs/operators' 导入 {catchError}；

• 静态不会改变，它们是不可出租的(参见 https://github.com/ReactiveX/rxjs/issues/3059)

• 静态只能在 app.component.ts 中为所有应用导入一次(这不会减少包大小但代码会更干净)