Selectors No overload matches this call

Question

Here's my selector.ts

export interface ITestState {
  value: number;
}
export interface IReduxState {
  test: ITestState;
}
export const selectTest = (state: IReduxState) => state.test;
export const selectTestValue = createSelector(
  selectTest,
  (state: ITestState) => state.value
);

Ïf i try to use it in app.component.ts Like so

  constructor(private store: Store) {
    this.vaschal$ = store.select(selectTestValue);
  }

I get the following error

No overload matches this call.
  Overload 1 of 9, '(mapFn: (state: object) => number): Observable<number>', gave the following error.
    Argument of type 'MemoizedSelector<IReduxState, number, DefaultProjectorFn<number>>' is not assignable to parameter of type '(state: object) => number'.
      Types of parameters 'state' and 'state' are incompatible.
        Property 'test' is missing in type '{}' but required in type 'IReduxState'.
  Overload 2 of 9, '(key: never): Observable<never>', gave the following error.
    Argument of type 'MemoizedSelector<IReduxState, number, DefaultProjectorFn<number>>' is not assignable to parameter of type 'never'

angular version 11.2.4 What do i do wrong?

Answer 1

You need to inform the Store of the root store state:

constructor(private store: Store<IReduxState>) {
  this.vaschal$ = store.select(selectTestValue);
}