首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Angular 9/rxjs:如何处理switchMap内部抛出的错误?

Angular 9/rxjs:如何处理switchMap内部抛出的错误?
EN

Stack Overflow用户
提问于 2020-06-25 04:17:46
回答 2查看 1.6K关注 0票数 1

我使用的是Angular (9) powered Bootstrap (6.1.0) TypeAhead,它的搜索函数定义如下:

代码语言:javascript
运行
AI代码解释
复制
search = (text$: Observable<string>) => {
    return text$.pipe(
      debounceTime(200),
      distinctUntilChanged(),
      // switchMap allows returning an observable rather than maps array
      switchMap((searchText) => {
        if (!searchText || searchText.trim().length == 0) {
          // when the user erases the searchText
          this.dealerRepUserID = 0;
          this.dealerRepChanging.emit(this.dealerRepUserID);
          return EMPTY;
        }
        else if (this.dealerID == this.hostOrganizationID) {
          // get a list of host reps
          return this.myService.getHostRepsAutoComplete(searchText, this.includeInactive);
        } else {
          // get a list of dealer reps
          return this.myService.getDealerReps(this.dealerID, searchText);
        }
      })
    );
  }

该函数必须返回一个可观察对象。如何捕获在switchMap中抛出的错误?

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2020-06-25 04:24:32

你试过catchError吗?

代码语言:javascript
运行
AI代码解释
复制
import { catchError } from 'rxjs/operators';
代码语言:javascript
运行
AI代码解释
复制
return text$.pipe(
      debounceTime(200),
      distinctUntilChanged(),
      // switchMap allows returning an observable rather than maps array
      switchMap((searchText) => {
        if (!searchText || searchText.trim().length == 0) {
          // when the user erases the searchText
          this.dealerRepUserID = 0;
          this.dealerRepChanging.emit(this.dealerRepUserID);
          return EMPTY;
        }
        else if (this.dealerID == this.hostOrganizationID) {
          // get a list of host reps
          return this.myService.getHostRepsAutoComplete(searchText, this.includeInactive).pipe(catchError(error => of());
        } else {
          // get a list of dealer reps
          return this.myService.getDealerReps(this.dealerID, searchText).pipe(catchError(error => of());
        }
      })
    );

这是我的应用效果

代码语言:javascript
运行
AI代码解释
复制
public loadDataPerformance$: Observable<Action> = createEffect(() => {
    return this.actions$.pipe(
      ofType(RiskProfileActions.loadDataPerformance),
      withLatestFrom(
        this.store$.select(fromRoot.getAnalyticsFilterSelectedOptions),
        this.store$.pipe(select(fromFactoryPerformance.getFactoryId))
      ),
      switchMap(([{ recordDate }, filters, factoryId]) =>
        this.riskProfileApiService.getDataPerformanceData(filters, factoryId, recordDate).pipe(
          map((riskDataPerformanceData: PerformanceDataModel) =>
            RiskProfileActions.loadRiskScoreBreakdownPerformanceSuccess(riskDataPerformanceData)
          ),
          catchError(error => of(RiskProfileActions.loadRiskScoreBreakdownPerformanceFail(error)))
        )
      )
    );
  });
票数 2
EN

Stack Overflow用户

发布于 2020-06-25 10:14:02

switchMap本身不会抛出任何错误,可能会产生意想不到的事情是返回的可观察对象this.myService.getHostRepsAutoCompletethis.myService.getDealerReps。捕获错误的一个棘手时刻是,每当有error时,抛出错误的可观察对象就会被杀死。

例如

代码语言:javascript
运行
AI代码解释
复制
observable$.pipe(
 switchMap(() => observable2$),
 catchError(() => doSomethingFunction())
).subscribe()

一旦出现错误,observable$将被完成,这将完成您的搜索流,错误发生后,您将不会获得更多数据。

正如Phat Tran Ky在他的示例中所展示的那样,错误的处理应该发生在switchMap操作符的新流中

代码语言:javascript
运行
AI代码解释
复制
observable$.pipe(
 switchMap(() => observable2$.pipe(catchError(() => doSomethingFunction())),
 )
).subscribe()

这样,每当内部抛出错误时,它将终止内部可观察对象(observable2$),但不会终止外部可观察对象observable$上的外部订阅

为了在一个点处理错误,您可以执行的进一步增强可能是将内部可观察对象合并到一个点中,例如,如下所示

代码语言:javascript
运行
AI代码解释
复制
observable$.pipe(
 switchMap(() => {
   return merge(
   observable1$.pipe(filter(() => ${your if else condition for case 1})),
   observable2$.pipe(filter(() => ${your if else condition for case 2})),
   observable3$.pipe(filter(() => ${your if else condition for case 3})),
   ).pipe(catchError((error) => yourErrorHandlerFunction(error)))
  })),
 )
).subscribe()
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/62567799

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档