【问题标题】:Change root state property from feature module ngrx从功能模块 ngrx 更改根状态属性
【发布时间】:2021-01-14 09:28:31
【问题描述】:

问题描述 我有一个微调模块,它根据我的根状态下的加载属性显示/隐藏。这被放置在 AppComponent 中。

export interface AppState {
  loading: boolean
}

我有多个延迟加载的功能模块,每个模块都通过自己的一组效果获取数据。在执行此操作时,我想在效果开始时将 AppState.loading 更新为 true,然后在效果完成时将其设置回 false。

我该怎么做?

解决方法 作为一种解决方法,我在触发我的功能操作之前调度了根操作中定义的操作(将加载设置为 true),然后功能效果返回一组操作。其中一项操作再次属于根操作(将加载设置为 false)。

service.ts

public getMilestonesAction(q: string) {
  this.store.dispatch(AppActions.loadingAction({ loading: true})); // This belongs to root-actions
  return this.store.dispatch(CalendarActions.getEntriesAction({ q })); // This belongs to feature-actions
}

effect.ts

getMilestonesEffect$ = createEffect(() => this.action$
  .pipe(
    ofType(CalendarActions.getEntriesAction),
    mergeMap(action => this.calendarService.getMilestones(action.q)
    .pipe(
      switchMap((data: Milestone[]) => [AppActions.loadingAction({ loading: false }), CalendarActions.getEntriesSuccessAction({ milestones: data })]),
      catchError((error: any) => from([AppActions.loadingAction({ loading: false }), CalendarActions.getEntriesFailureAction( { error: this.getErrorMessage(error) })]))
    ))
  ));

这是解决这个问题的正确方法吗?

【问题讨论】:

    标签: angular ngrx


    【解决方案1】:

    这是正确的,你做对了。

    rootfeature 只允许您为需要它们的模块延迟加载reducer 和效果,但它们都可以完全访问存储并且可以使用它们需要的操作。

    Angular 建议使用 core/feature/shared 模块组。在这种情况下,加载动作将在coreshared 中,您觉得更合适。

    【讨论】:

    • 在共享模块中使用公共状态似乎是一个很好的建议。谢谢你!我会等待一段时间,看看是否有人提供其他选择。否则我会将您的回复标记为答案。
    猜你喜欢
    • 2018-12-05
    • 1970-01-01
    • 2021-11-02
    • 1970-01-01
    • 2018-10-16
    • 1970-01-01
    • 2022-06-18
    • 2015-06-06
    • 1970-01-01
    相关资源
    最近更新 更多