angular - 将操作符修补为 pipable 操作符，角度 5 到 6

Question

我正在从 angular 5 迁移到 6，但我无法弄清楚新的可管道运算符语法。

考虑我的 Angular 5 http 拦截器

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
this.request = req;

//do stuff
return next.handle(this.request)
  .do(event => {

   //do logging stuff
  },
  err => {
    //do error stuff
  });
}

这是我尝试将其转换为pipe方式

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
this.request = req;

//do stuff
return next.handle(this.request).pipe(
  tap(event => {

   //do logging stuff
  },
  err => {
    //do error stuff
  }));
}

但是，这不会编译 - 与pipe函数有关的整个事情都带有以下错误的下划线。

Severity    Code    Description Project File    Line    Suppression State
Error   TS2345  (TS) Argument of type 'MonoTypeOperatorFunction<{}>' is not 
assignable to parameter of type 'UnaryFunction<Observable<HttpEvent<any>>, 
Observable<any>>'.
Types of parameters 'source' and 'source' are incompatible.
Type 'Observable<HttpEvent<any>>' is not assignable to type 
'Observable<{}>'.
  Property 'source' is protected in type 'Observable<HttpEvent<any>>' but public in type 'Observable<{}>'.  C:\Users\stas.levich\Documents\Projects\EEA.Projects\DEP\MassAir\Web (tsconfig or jsconfig project) C:\Users\stas.levich\Documents\Projects\EEA.Projects\DEP\MassAir\Web\src\app\services\httpinterceptor.service.ts    44  Active

Answer 1

试试下面的代码：

return next.handle(authReq).pipe(
        tap(event => {
            return event;
        }),
        catchError(error => {

            // On Error
        }),
        finalize(() => {
         // on finalize
        })
    );

Answer 2

这pipe需要一组运算符。是tap一个运算符。该 err =>函数不是有效的 RxJs 运算符。尝试catchError

这是我的一种 get 方法的示例：

 getMovies(): Observable<Movie[]> {
    return this.http.get<Movie[]>(this.moviesUrl)
      .pipe(
        tap(data => console.log(JSON.stringify(data))),
        catchError(this.handleError)
      );
  }