How to implement error handling in Angular and RXJS

Question

I would like to perform error handling in the use case method using the subscription. If an error is thrown in the adapter, the handling should be performed in the use case. Unfortunately, the catch does not work with the example below, only the error from the adapter is thrown.

  public checkInUsecase(): void {
    this.checkInAdapter().subscribe(
      (data) => {
        this.logger.debug('Work...');
      },
      (error) => {
        this.logger.error('Error.');
      },
      () => {
        this.logger.debug('Successful.');
      }
    );
  }

  public checkInAdapter(): Observable<boolean> {
    throw new Error('Check in error');
  }

Consider catchError operator rxjs.dev/api/operators/catchError — Chaka15
– Chaka15, Commented Jan 6, 2022 at 9:39

vaira · Accepted Answer · 2022-01-06 09:58:47Z

1

Error is thrown inside an observable. In your example the function is not returning an observable.

public checkInUsecase(): void {
    this.checkInAdapter()
        .pipe(catchError(err) => {
            this.logger.error('Error.');
            throw EMPTY;
        })
        .subscribe((data) => {
            this.logger.debug('Work...');
        });
}

public checkInAdapter(): Observable < boolean > { // this method needs to return an observable
    return new Observable((subscriber) => {
        if (!isAllGood) {
            throw Error('error message'); // error is thrown inside the observable.
        }
    });
}

edited Jan 6, 2022 at 9:58

answered Jan 6, 2022 at 9:50

vaira

2,2801 gold badge13 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

laprof Over a year ago

How does it work when the returned observable is from another method and the error is thrown not in the returned observable like below. ` public checkInAdapter(): Observable<boolean> { if(!isAllGood) { throw Error('error message'); } return api.checkin(); } `

vaira Over a year ago

if I am understanding you correct, your error is thrown even before you have reached the 'return api.Checkin()', in that case its not an observable error, becase observer has not even been subscribed to yet. you can imagine the error being even thrown even before calling thishis.checkInAdapter()

vaira Over a year ago

Do you only know about error after the repsonse or even before subscribing, these two situation will have totally different code.

Leonardo Freire · Accepted Answer · 2022-01-06 09:41:19Z

0

There's a special pipe in Angular that allows you to catch errors in an Observable and react accordingly.

public checkInUsecase(): void {
  this.checkInAdapter()
    .pipe(catchError(err) => {
        this.logger.error('Error.');
        throw EMPTY;
    })
    .subscribe((data) => {
        this.logger.debug('Work...');
    });
}

public checkInAdapter(): Observable<boolean> {
  throw new Error('Check in error');
}

answered Jan 6, 2022 at 9:41

Leonardo Freire

3091 silver badge7 bronze badges

3 Comments

laprof Over a year ago

This does not work for me.

vaira Over a year ago

does this case make sense when the checkInAdapter will never even return an observable?

Leonardo Freire Over a year ago

@laprof that's because you're not throwing the error correctly. It's not a problem with the catchError pipe. I was just showing you pseudo-code to show the correct way to handle an error.

Collectives™ on Stack Overflow

How to implement error handling in Angular and RXJS

2 Answers 2

3 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related