angular - 使用@ngrx/store 进入 angular 2 模块

Question

我在当前应用程序中成功使用了@ngrx/store(还有@ngrx/effects 和@ngrx/store-devtools)。现在我想制作模块，这将是独立于应用程序其余部分的理想选择。问题是如何在其中也使用@ngrx/store？ 我能否以某种方式将新的 reducer 添加到现有的“app”商店中？我想避免将模型从模块移动到应用程序并将 reducer 注册到应用程序中。有人对此有解决方案吗？示例代码如下:

// App declarations
export const APP_IMPORTS = [
  .
  .
  .
  StoreModule.provideStore(reducer),
  EffectsModule.run(someEffects),
  STORE_DEV_TOOLS_IMPORTS
];

@NgModule({
  declarations: [
    APP_DECLARATIONS,
    AppComponent
  ],
  imports: [
    APP_IMPORTS
  ],
  providers: [APP_PROVIDERS],
  bootstrap: [AppComponent]
})
export class AppModule {
}

在新模块中:

// Module declaration
@NgModule({
  imports: [CommonModule, 
           FormsModule, 
           StoreModule.provideStore({ counter: counterReducer }) // <-- how to change this to just add to current store new reducer??
  ],
  exports: [MyTestComponent],
  declarations: [MyTestComponent],
})
export class SomeModule {
}

还有谁知道如何更改在 devtool 上显示的@ngrx/store 的名称？将其从 ngrx-store-some_random_number 更改为某个 app_name？

非常感谢

Answer 1

从 ngrx4 开始，您提供的存储为:StoreModule.forRoot({router: routerReducer})

@NgModule({
    imports: [
        StoreModule.forRoot({router: routerReducer}),
        EffectsModule.forRoot([...]),
        ...
    ],
    declarations: [],
    ...
})
export class AppModule {}

然后在您的功能模块中，您可以将商店作为 StoreModule.forFeature(...) 提供:

@NgModule({
    imports: [
        StoreModule.forFeature('feature', featureReducer),
        EffectsModule.forFeature([...]),
        ...
    ],
    declarations: [],
    ...
})
export class FeatureModule {}

feature 状态将在存储中的 state.feature 键下。

使用可以使用选择器一致地访问特征存储:

export const selectFeatureModule = createFeatureSelector<FeatureState>('feature');
export const selectFeatureValue = createSelector(selectFeatureModule ,
(state: FeatureState) => state.someValue);

在功能模块中:Angular 组件可以使用/slice 状态作为:

...
constructor(private store: Store<AppState>,) {
    this.store.select(selectFeatureValue)
        .subscribe(console.log.bind(console));

}
...