使用 StoreModule.forRoot 或 StoreModule.forFeature 哪个？

Question

我正在阅读，他们说.forRoot 合并了所有减速器，并且在以这种方式操作 state 时，您将同时操作所有减速器。

Soon.forFeature 允许您操纵每个减速器，就好像每个减速器都有一个 state。

我想知道以下内容：

1）这是真的吗？

2) 如何将.forFeature()与多个减速器一起使用？

我收到以下错误：

NullInjectorError: R3InjectorError(AppModule)[StoreFeatureModule -> ReducerManager -> ReducerManager -> ReducerManager]: 
  NullInjectorError: No provider for ReducerManager!

模块

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';

import { environment } from 'environments/environment';
import { StoreModule } from '@ngrx/store';
import { EffectsModule } from '@ngrx/effects';
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
import { STORE_REDUCERS, STORE_EFFECTS } from './store';

import { AppComponentModule } from '@app/components/app-component.module';
import { AppComponent } from './app.component';

@NgModule({
    declarations: [AppComponent],
    imports: [
        BrowserModule,
        AppComponentModule,
        HttpClientModule,
        StoreDevtoolsModule.instrument({ maxAge: 25, logOnly: !environment.production }),
        StoreModule.forFeature('people', STORE_REDUCERS),
        EffectsModule.forFeature(STORE_EFFECTS),
    ],
    providers: [],
    bootstrap: [AppComponent],
})
export class AppModule {}

人物选择器

import { createFeatureSelector, createSelector } from '@ngrx/store';
import { State, adapter } from './people.reducer';

const featureSelector = createFeatureSelector<State>('people');

export const { selectIds, selectEntities, selectAll, selectTotal } = adapter.getSelectors(featureSelector);

export const getLoading = createSelector(featureSelector, ({ loading }) => loading);
export const getError = createSelector(featureSelector, ({ error }) => error);
export const getMain = createSelector(selectAll, (peoples) => peoples.filter((people) => people.isMain)[0]);

商店索引：

import { ActionReducerMap } from '@ngrx/store';
import * as fromPeopleReducer from './people/people.reducer';
import * as fromPeopleEffects from './people/people.effects';

export interface StoreState {
    people: fromPeopleReducer.State;
}

export const STORE_REDUCERS: ActionReducerMap<StoreState> = {
    people: fromPeopleReducer.reducer,
};

export const STORE_EFFECTS: any[] = [fromPeopleEffects.Effects];

Answer 1

.forFeature不是.forRoot的替代品，它是一种从延迟加载的模块或导入的库中将 reducer 和效果注入全局存储的方法。

在AppModule或您的根模块中，您必须至少拥有

imports: [
  StoreModule.forRoot({}),
  EffectsModule.forRoot([]),
],

然后在任何其他导入的模块中，您可以添加类似

imports: [
  StoreModule.forFeature('addresses', reducers.addresses),
  StoreModule.forFeature('companies', reducers.companies),
  StoreModule.forFeature('users', reducers.users),
  EffectsModule.forFeature([EntityEffects]),
],

这意味着addresses 、 companies 、 users功能将被添加到全球商店。 如果您在多个模块中执行此操作，它仍将使用相同的功能名称，它不会为每个模块创建存储上下文。 Reducers 也将接收应用程序中所有可用的操作和效果。

如果您使用 ngrx 库编写ngrx或者如果没有此模块及其组件，它的减速器/效果无用，我建议使用.forFeature 。