Angular : how to call finally() with RXJS 6

2020-02-24 12:02发布

问题:

I was using RXJS 5, now as I upgraded it to 6, I am facing some problems.

Previously I was able to use catch and finally but as per update catch is replaced with catchError (with in the pipe) now how to use finally?

Also I have some questions :

Do I need to change throw->throwError (in below code Observable.throw(err);)

import { Observable, Subject, EMPTY, throwError } from "rxjs";
import { catchError } from 'rxjs/operators';

return next.handle(clonedreq).pipe(
          catchError((err: HttpErrorResponse) => {
        if ((err.status == 400) || (err.status == 401)) {
            this.interceptorRedirectService.getInterceptedSource().next(err.status);
            return Observable.empty();
        } else {
            return Observable.throw(err);
        }
       }) 
        //, finally(() => {
        //  this.globalEventsManager.showLoader.emit(false);
        //});
      );

Also how to use publish().refCount() now ?

回答1:

  • use throwError instead of Observable.throw, see https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/v6/migration.md#observable-classes

  • finally was renamed to finalize and you'll use it inside pipe() among other operators.

  • the same with publish() and refCount(). Both are operators you'll use inside pipe().



回答2:

Need to import finalize from rxjs/operators.

import { finalize } from 'rxjs/operators';

Then finalize is used inside the pipe(),

observable()
    .pipe( 
         finalize(() => {
              // Your code Here
         })
     )
    .subscribe();


回答3:

According to official document, You should change your code like this to avoid compile error: (You must throw exception in catchError method. finalize callback method has no argument.)

import { catchError, finalize } from 'rxjs/operators';

return next.handle(clonedreq).pipe(
  catchError(error => {
    console.log('error occured:', error);
    throw error;
  }),
  finalize(() => {
    console.log('finalize')
  })
);

It is successfully compiled in Angular CLI: 7.1.4.