angular - @ngrx/effect 中止 Angular 应用程序中的多个 REST 调用

Question

我遇到以下问题:

在服务内部，我在 forEach 循环中触发相同的 ngrx 操作

 sensorCategories.forEach(category => {
     if (category === 'power' || category === 'air-flow') {
       this.store.dispatch(new fromEnergyManagementActions.FetchBigWidgetDataAction({ category: category }));
     } else {
       this.store.dispatch(new fromEnergyManagementActions.FetchSmallWidgetDataAction({ category: category }));
     }
 });

<小时/>

这将触发下一个副作用:

@Effect()
fetchSmallWidgetData: Observable<Action> = this.actions
    .ofType(fromEnergyManagementActions.FETCH_SMALL_WIDGET_DATA)
    .map(toPayload)
    .switchMap(payload => this.dashboardDataService.fetchSmallWidgetData(payload))
    .map((data: SmallWidgetData) => new fromEnergyManagementActions.FetchSmallWidgetDataSuccessAction(data))
    .catch(error => of(new fromEnergyManagementActions.FetchSmallWidgetDataFailureAction()));

<小时/>

服务中的 fetchSmallWidgetData 方法将使用"new"HttpClient 执行其余调用。

以下是日志:

所以问题是，ngrx/effect 中止了之前的调用。我在中间设置了一个超时来测试它。当超时足够长时，一切都会成功。

你的建议是什么？有我可以使用的最佳实践吗？感谢您的帮助

Answer 1

发生这种情况是因为您使用 switchMap在你的效果中。切换至mergeMap允许维护多个内部订阅。