Up to this point, we have learned how we move the store state declaration from app.module.ts and register it in each feature module instead. This will provide us with a little more order. Let's take a close look at the types used for registering state. ActionReducerMap is a type we have been using implicitly so far. We have been using it every time we call StoreModule.forRoot() or StoreModule.forFeature(). We have been using it in the sense that, the object we pass containing state and their reducers consists of this type. Let's prove that is the case by turning to our counter.module.ts:
// counter.module.ts
@NgModule({
imports: [
StoreModule.forFeature('counter',{
data: counterReducer
})
]
})
Let's change that a bit, to this:
// counter.reducer.ts
export interface CounterState = {
data: number
};
export reducer: ActionReducerMap<CounterState> = {
data: counterReducer
}
// counter.module.ts
@NgModule({
imports: [
StoreModule.forFeature('counter', reducer)
]
})
Now, we can see that we are leveraging ActionReducerMap, which is a generic that forces us to provide it with a type. In this case, the type is CounterState. Running this code should just work. So, why use ActionReducerMap explicitly like this?