Angular 使用StoreModule.forRoot还是StoreModule.forFeature?
我读到了,他们说,forRoot合并了所有的还原程序,当用这种方式操作状态时,你同时操作了所有的还原程序 forFeature允许您操纵每个减速器,就好像每个减速器都有一个状态一样 我想知道以下几点: 1) 这是真的吗 2) 如何将Angular 使用StoreModule.forRoot还是StoreModule.forFeature?,angular,ngrx,Angular,Ngrx,我读到了,他们说,forRoot合并了所有的还原程序,当用这种方式操作状态时,你同时操作了所有的还原程序 forFeature允许您操纵每个减速器,就好像每个减速器都有一个状态一样 我想知道以下几点: 1) 这是真的吗 2) 如何将.forFeature()与多个减速器一起使用 我收到以下错误: NullInjectorError: R3InjectorError(AppModule)[StoreFeatureModule -> ReducerManager -> ReducerMa
.forFeature()
与多个减速器一起使用
我收到以下错误:
NullInjectorError: R3InjectorError(AppModule)[StoreFeatureModule -> ReducerManager -> ReducerManager -> ReducerManager]:
NullInjectorError: No provider for ReducerManager!
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];
模块
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]);
从'@ngrx/store'导入{createFeatureSelector,createSelector};
从“/people.reducer”导入{State,adapter};
const featureSelector=createFeatureSelector('people');
导出常量{selectId,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,(people)=>people.filter((people)=>people.isMain)[0]);
存储索引:
NullInjectorError: R3InjectorError(AppModule)[StoreFeatureModule -> ReducerManager -> ReducerManager -> ReducerManager]:
NullInjectorError: No provider for ReducerManager!
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];
从'@ngrx/store'导入{ActionReducerMap};
从“./people/people.reducer”导入*作为peoplereducer;
从“/people/people.effects”导入*as fromPeopleEffects;
导出接口存储状态{
人:来自PeopleReducer.State;
}
导出常量存储\u还原程序:ActionReducerMap={
人:来自peoplereducer.reducer,
};
导出常量存储效果:any[]=[fromPeopleEffects.EFFECTS];
。forFeature
不是的替代品。forRoot
是一种将延迟加载的模块或导入的库中的还原器和效果注入全局存储的方法
在AppModule
或根模块中,您必须至少具有
导入:[
StoreModule.forRoot({}),
EffectsModule.forRoot([]),
],
然后在任何其他导入的模块中,您可以添加如下内容
导入:[
StoreModule.forFeature('addresses',Reducer.addresses),
StoreModule.forFeature('companys',reducers.companys),
StoreModule.forFeature('users',reducer.users),
EffectsModule.forFeature([EntityEffects]),
],
这意味着地址
,公司
,用户
功能将添加到全局存储中。如果在多个模块中执行此操作,它仍将使用相同的功能名称,但不会为每个模块创建存储上下文。还原者将接收应用程序中的所有可用动作和效果
如果您为
ngrx
编写了一个包含库的包,或者如果没有这个模块及其组件,它的缩减器/效果是无用的,我建议您使用.forFeature
。.forFeature
不是的替代品。forRoot
,这是一种从延迟加载的模块或导入的库向全局存储注入减缩器和效果的方法
在AppModule
或根模块中,您必须至少具有
导入:[
StoreModule.forRoot({}),
EffectsModule.forRoot([]),
],
然后在任何其他导入的模块中,您可以添加如下内容
导入:[
StoreModule.forFeature('addresses',Reducer.addresses),
StoreModule.forFeature('companys',reducers.companys),
StoreModule.forFeature('users',reducer.users),
EffectsModule.forFeature([EntityEffects]),
],
这意味着地址
,公司
,用户
功能将添加到全局存储中。如果在多个模块中执行此操作,它仍将使用相同的功能名称,但不会为每个模块创建存储上下文。还原者将接收应用程序中的所有可用动作和效果
如果您为
ngrx
编写了一个包含库的包,或者如果没有此模块及其组件,它的减速器/效果就没有用处,我建议您使用.forFeature
。您至少需要一个forRoot。简单规则:app.module->forRoot,feature module->forFeature在拥有任何forFeature
之前,您必须至少拥有一个forRoot
。它就像路由器一样:在功能模块中使用forFeature
;你至少需要一个forRoot。简单规则:app.module->forRoot,feature module->forFeature在拥有任何forFeature
之前,您必须至少拥有一个forRoot
。它就像路由器一样:在功能模块中使用forFeature
;