Обработка ошибок с RxJS и угловым асинхронным каналом

Question

Я использую Angular & RxJS для создания некоторых реактивных приложений. Недавно я видел, что хорошее использование Reactive Programming не включает «.subscribe», что больше похоже на императивное программирование (извлечение данных вручную).

Сейчас я пытаюсь использовать асинхронный канал в Angular с RxJS и он работает нормально, получая данные асинхронно.

Но как я могу ловить ошибки так же, как я делал с ".subscribe", например:

    this.http.getUsers().subscribe(
(success) => console.log(success) // everything is good
(error) => console.log(error) // an error happened 
)

В реактивном режиме код больше похож на

this.http.getUsers().pipe(

switchMap(value => console.log(value))

); // no clue to handle errors with using subscribe

Даже если второй метод более реактивный, я бы хотел найти способ обрабатывать ошибки так же, как и «.subscribe».

Заранее спасибо

Answer 1

Вы можете создать тему, которую вы заполняете при ошибке.

errorObs = new Subject()

result = this.http.getUsers().pipe(
    switchMap(value => console.log(value); //must return an Observable),
    catchError(e => {
        this.errorObs.next(true)
        return throwError(e)
    })
);

Ваш шаблон будет выглядеть примерно так:

<ng-container *ngIf="result | async"> 
    success data
</ng-container>

<ng-container *ngIf="errorObs | async">
     error data
</ng-container>