angular - 使用新的 Ngrx 8 createEffect 模式时多次触发服务方法

标签 angular ngrx ngrx-effects

将一些功能效果切换到新的 createEffct() 模式后,它们调用的所有服务请求现在都在我的控制台输出中触发了两次。

这是 Action :

export const getSetting = createAction(
  '[Practitioner Settings] Get Setting',
  props<{ name: string }>(),
);

下面是一个使用旧语法的 Effect 示例:

@Effect()
getSetting$: Observable<Action> = this.actions.pipe(
  ofType(PractitionerSettingsActionTypes.GetSetting),
  map((action: PractitionerSettingsActions.GetSetting) => action.name),
  switchMap((name: string) => {
    return this.practitionerSetingsService
               .getSetting(name)
               .pipe(
                 map(response => new PractitionerSettingsActions.GetSettingSuccess(response)),
               )
    }),
  );

和新语法,基于示例:https://github.com/ngrx/platform/blob/master/projects/example-app/src/app/books/effects/collection.effects.ts :

@Effect()
getSetting = createEffect(() =>
  this.actions.pipe(
    ofType(PractitionerSettingsActions.getSetting),
    mergeMap(({ name }) => {
      return this.practitionerSetingsService
                 .getSetting(name)
                 .pipe(
                    map(response => PractitionerSettingsActions.getSettingSuccess({ setting: response })),
                  )
      }),
    )
  );

我怀疑是 mergeMap 运算符导致了这种行为,因为这是两者之间的唯一区别,但我不确定为什么会导致这种情况,或者如何在另一个中访问操作的有效负载方式。

除了将 Ngrx Actions、Reducers 和 Effects 更新为 v8 模式之外,我没有对我的应用程序进行任何其他更改,这会导致服务调用执行两次。

如果不是 mergeMap,我应该使用什么运算符来访问操作负载?如果 mergeMap 是正确的,为什么我的效果运行不止一次?

最佳答案

如果您检查链接的示例,@Effect() 注释不存在,它存在于问题代码中。我认为这就是它以这种方式为您工作的原因

关于angular - 使用新的 Ngrx 8 createEffect 模式时多次触发服务方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57317105/

相关文章:

javascript - 相当于 typescript 中的异步管道

angular - 使用 angular2 的 Mailchimp 注册表单

Angular 6 NGRX 分页,如何定义高级分页的操作

ngrx,如何从 api 获得起始状态?

angular - Ngrx 一次分派(dispatch)一个 Action 多次

angular6 - 用于下载媒体文件和调度进度的 NgRX Effect;如何处理流和节流

angular - 如何在HTML元素属性值计算中使用ngFor索引变量?

javascript - 为什么我的 @Effect 在 Angular 6 中用 ngrx 覆盖现有状态?

Angular ngrx@effect 基本问题 : Type 'Observable<void>' is not assignable to type

Angular 2 为单个服务或每个请求禁用 XSRFStrategy