Here is a simplified version of my Angular 5 application. I have a reducer that needs to be registered in the root module. The problem arises in LINE A where I encounter the following error:
ERROR in src/app/store/app.reducers.ts(7,14): error TS2322: Type '{ post: (state: State, action: Action) => void; }' is not assignable to type 'ActionReducerMap<AppState, Action>'.
Types of property 'post' are incompatible.
Type '(state: State, action: Action) => void' is not assignable to type 'ActionReducer<State, Action>'.
Type 'void' is not assignable to type 'State'.
app.module.ts : Root module
imports: [
...
StoreModule.forRoot(reducers)
],
store/app.reducers.ts : inside Global store
import {ActionReducerMap} from "@ngrx/store";
import * as fromPost from "../postDir/store/post.reducers";
export interface AppState {
post:fromPost.State
}
export const reducers: ActionReducerMap<AppState> = { //=======LINE A ======
post:fromPost.postReducer
};
postDir/store/post.reducers.ts :inside local store
export interface State{
query:string
posts:Post[]
}
const initialPostState: State = {
query:"initial",
posts:[]
};
export function postReducer(state = initialPostState, action:postActions.PostActions){}
If I replace <AppState> with <any> in LINE A, the code works fine. Has anyone else encountered this issue? I have tried searching online but couldn't find any significant solutions.