RxJS - 在 catchError 塊中使用 observable

Question

我有 2 個服務budgetTestService和budgetService ，當有錯誤時我需要使用budgetTestService，當沒有錯誤時我需要使用budgetService。 沒有調用budgetTestService.getBudgetService()管道中的budgetTestService.getBudgetService() - console.log('test service complete');

不確定這是否應該如何完成它看起來像是我在嵌套並且做錯了，我是否正確使用了語法？

this.budgetService.getBudgetDays(this.startDate, this.finishDate)
    .pipe(
      map(res => {
        console.log('get budget day server mapping');
        self.timelineBudgetDates = self.processDates(res);

      }),
      //map(res => {
      //  self.timelineBudgetDates = self.budgetTestService.getBudgetDates(self.startDate, self.finishDate);
      //})
      catchError(error => {
        console.log('error code running');
        console.log(error);
        self.budgetTestService.getBudgetDates(self.startDate, self.finishDate)
                              .pipe(
                                map(res => {
                                  console.log('test service complete');
                                  console.log(res);
                                  self.timelineBudgetDates = res;
                                })
                              );
        return of('some return value, maybe null, maybe a good default');
      })
    )

    .subscribe(res => {
      console.log('Response = ', res);
      //self.timelineBudgetDates = self.processDates(res);
      //self.timelineBudgetDates = res;

    });

budgetTestService ：

getBudgetDates(startDate: string, endDate: string): Observable<BudgetDate[]> {

    console.log('getting budget dates from test service');

    let dates = this.datesOfRange(moment(startDate), moment(endDate));
    //console.log('dates:', dates);

    let budgetDates: BudgetDate[] = [
      new BudgetDate({ moment: moment().subtract(1, 'd').startOf('d'), earned: 100, spent: 50, onServer: true }),
      new BudgetDate({ moment: moment().subtract(2, 'd').startOf('d'), earned: 101, spent: 51, onServer: true }),
      new BudgetDate({ moment: moment().subtract(3, 'd').startOf('d'), earned: 102, spent: 52, onServer: true }),
      new BudgetDate({ moment: moment().subtract(4, 'd').startOf('d'), earned: 103, spent: 53, onServer: true })
    ];

    const mockResults = function(observer: Observer<BudgetDate[]>) {
      observer.next(budgetDates);
      observer.error('...');
      observer.complete;
    };
    const update = new Observable(mockResults).pipe(
      catchError((error: any) => Observable.throw(error))
    );
    return update;
  }

輸出：不包括： test service complete

error code running
HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: null, ok: false, …}
getting budget dates from test service
Response =  some return value, maybe null, maybe a good default

Answer 1

RxJS 可觀察鏈只有在訂閱時才會執行。 因此，不包括test service complete輸出背后的問題是您從未訂閱測試服務調用。 特別的問題在這里：

catchError(error => {
  self.budgetTestService.getBudgetDates(self.startDate, self.finishDate)
    .pipe(
      // ...
    );

  // RETURNING OTHER OBSERVABLE HERE
  return of('some return value, maybe null, maybe a good default');
})
// ...
.subscribe(console.log)

在這里您調用budgetTestService ，但它的 Observable 從未被訂閱。 比較一下：

catchError(error => {
  return self.budgetTestService.getBudgetDates(self.startDate, self.finishDate)
    .pipe(
      // ...
    );
})
// ...
.subscribe(console.log)

在后面的代碼示例中，我們從budgetTestService返回observable，它將成為訂閱鏈的一部分。

在這里檢查這個小例子來比較： “RxJS 中的異步錯誤處理程序”

希望這可以幫助