Question

我正在尝试在应用初始化时加载一些缓存的详细信息。我正在使用内置的APP_INITIALIZER角度提供程序。

在此提供程序中，我正在运行AppService的init方法并加载那些缓存的信息，并调度一些操作。 4个动作中的3个可以正常分派，但是当我尝试分派订单详细信息时，reducer无法执行此操作，因此无法将订单详细信息传输到存储中。

但是，当我查看redux chrome扩展名时，我可以看到我的动作正在调度，但是如果我在reducer中记录传入的动作，则看不到我的动作。

奇怪的是，如果三秒钟后我使用setTimeOut方法运行loadCachedOrderDetails方法，则成功调度了setCachedOrderDetails动作。

到底发生了什么事？如何正确分派setCachedOrderDetails动作？

这里是提供商的完整定义

    {
      provide: APP_INITIALIZER,
      useFactory: (app: AppService) => () => app.init(),
      deps: [AppService],
      multi: true
    }

AppService初始化方法

  init() {
    const request = this.loadCachedRequest();
    if (request) {
      this.loadCurrentLocation(request);
    }
    this.loadCachedBasketItems();
    this.loadCachedOrderDetails();
  }

和方法


  loadCachedOrderDetails() {
    const details = JSON.parse(localStorage.getItem('orderDetails'));
    if (details) {
      this.store.dispatch(PanelActions.setCachedOrderDetails({details}));
    }
  }

我注册减速器的面板商店

@NgModule({
  imports: [
    StoreModule.forFeature(panelFeatureKey, fromPanel.reducer),
    EffectsModule.forFeature([PanelEffects]),
  ],
  exports: [
    StoreModule,
    EffectsModule
  ]
})
export class PanelStoreModule {
}

Answer 1

如果您使用EffectsModule.forFeature，则表示该模块不是主要模块，并且您的应用程序已经初始化，并且很可能在需要该应用程序后才懒加载或初始化您的模块。

因此，您不能依赖任何INIT触发器。因为它们发出的声音可能早于您设置的功能并准备好听操作。

但是您可以简单地使用模块的构造函数来调度所需的操作。

@NgModule({
  imports: [
    StoreModule.forFeature(panelFeatureKey, fromPanel.reducer),
    EffectsModule.forFeature([PanelEffects]),
  ],
  exports: [
    StoreModule,
    EffectsModule,
  ]
})
export class PanelStoreModule {
  constructor(app: AppService) {
    app.init();
  }
}

或者只是将效果和缩小器移到forRoot部分。

Ngrx-Reducer无法接收操作

1 个答案: