ngrx 调度的动作未达到效果

Posted 2023-02-19

【中文标题】ngrx 调度的动作未达到效果

【英文标题】：ngrx dispatched action is not reached to effects

【发布时间】：2022-01-03 16:27:34

【问题描述】：

我是@ngrx 的新手。我在 business-unit.actions.ts 中创建了一个 @ngrx 操作并从组件中分派此操作。但由于某种未知的原因，该行动并未达到相关效果。我浏览 *** 和其他 @ngrx 教程。我已经检查了 Redux devtools，其中 loadSearchBusinessUnits 动作被完美地调度，但它没有到达 @ngrx/effects。任何形式的帮助将不胜感激。 提前致谢。

这是我的 business-unit.actions.ts 文件；

enum BusinessUnitActionsTypes 
  LoadSearch = '[Business-units] Load Search',
  LoadSearchSuccess = '[Business-units] Load Search Success',
  LoadSearchFailure = '[Business-units] Load Search Failure',



export const loadSearchBusinessUnits = createAction(
  BusinessUnitActionsTypes.LoadSearch,
  props< search: string >()
);

export const loadSearchBusinessUnitsSuccess = createAction(
  BusinessUnitActionsTypes.LoadSearchSuccess,
  props< businessUnits: BusinessUnit[] >()
);

export const loadSearchBusinessUnitsFailure = createAction(
  BusinessUnitActionsTypes.LoadSearchFailure,
  props< errorMsg: string >()
);

这是我的业务单元效果代码

loadSearchBusinessUnit$ = createEffect(() => this.actions$.pipe(
    ofType(BusinessUnitActions.loadSearchBusinessUnits),
    switchMap(( search ) => this.businessUnitService.loadBusinessUnitsSearch(search).pipe(
      map((businessUnits: BusinessUnit[]) => 
        return BusinessUnitActions.loadSearchBusinessUnitsSuccess( businessUnits );
      ),
      catchError(response => of(BusinessUnitActions.loadSearchBusinessUnitsFailure(
        errorMsg: response.error
      )))
    ))
  ));

【问题讨论】：

你在module:ngrx.io/guide/effects#registering-root-effects注册了Effect了吗？

我已经查过了。效果在模块内注册。

【参考方案1】：

在 ofType 中传递动作类型而不是动作对象。

loadSearchBusinessUnit$ = createEffect(() => this.actions$.pipe(
    ofType(BusinessUnitActions.LoadSearch),
    switchMap(( search ) => this.businessUnitService.loadBusinessUnitsSearch(search).pipe(
      map((businessUnits: BusinessUnit[]) => 
        return BusinessUnitActions.loadSearchBusinessUnitsSuccess( businessUnits );
      ),
      catchError(response => of(BusinessUnitActions.loadSearchBusinessUnitsFailure(
        errorMsg: response.error
      )))
    ))
  ));