angular8 - 如何取消 RXJS Effects 中的 Angular http 请求

Question

我想取消在角度 8 中的 RXJS 效果中发出的 http 请求。

@Effect() getReport$ = this.action$.pipe(
ofType(ActionTypes.GET_WIDGET),   
map(toPayload),
mergeMap(payload => {
  return this.dashboardService.getReport(payload).pipe(
    map(this.extractData),
    switchMap(result => {
      return observableOf(<ReceivedWidgetAction>{
        type: ActionTypes.RECEIVED_WIDGET,
        payload: result
      });
    }),
    catchError((err: Response | any) => {
      return this.handleReportError(err);
    }));

}));

请让我知道如何使用 angular 8 来做同样的事情。另外请注意，我将无法使用 switch map，因为多个小部件 angular 组件将使用不同的有效负载调用此操作。

Answer 1

我们可以通过使用 takeUnitil 运算符来取消正在进行的请求，并在需要取消请求时创建新操作并使用 store 调度相同的操作。

 @Effect() getReport$ = this.action$.pipe(
ofType(ActionTypes.GET_WIDGET),   
map(toPayload),
mergeMap(payload => {
  return this.dashboardService.getReport(payload).pipe(
    map(this.extractData),
    switchMap(result => {
      return observableOf(<ReceivedWidgetAction>{
        type: ActionTypes.RECEIVED_WIDGET,
        payload: result
      });
    }),
    takeUntil(this.action$.pipe(ofType(DashboardActionTypes.CANCEL_REQUEST))),
    catchError((err: Response | any) => {
      return this.handleReportError(err);
    }));

}));