ngrx: how to pass parameters to selector inside createSelector method ngrx: how to pass parameters to selector inside createSelector method angular angular

ngrx: how to pass parameters to selector inside createSelector method


From this blog post: https://timdeschryver.dev/blog/parameterized-selectors

As of NgRx 6.1 selectors also accepts an extra props argument. Whichmeans you can now define a selector as the following:

export const getCount = createSelector(  getCounterValue,   (counter, props) => counter * props.multiply);this.counter = this.store.pipe(  select(fromRoot.getCount, { multiply: 2 }));

Ah ... but rereading your question, you are asking then how to build another selector that uses this selector? The above-linked article suggests building a factory function.


I am using "@ngrx/entity": "7.2.0", and I can see that props are passed to each selector, for example in my component I am calling:

this.isActive$ = this.store.pipe(select(fromClient.isActive, { id: 'someid' }));

And then in my reducer I have the following:

export const getState = createFeatureSelector('state');export const getEntity = createSelector(  getState,  (state, props) => {    // do something with props.id to get an entity then:    return state;  });export const isActive: = createSelector(  getEntity, // props are passed to here  (state: any) => { // i don't add the props argument here, as i don't need them    return state.isActive;  });


You could use the projector function:

export interface Record {  // Some sort of record interface}export interface State {  records: Record[];}export const getRecords = createSelector(  getState,  (state: State): Record[] => state.records));export const getRecordByIndex = createSelector(  getRecords,  (records: Record[], { index }) => records[index]),);export const getFirstRecord = createSelector(  getRecords,  (records: Record[]) => getRecordByIndex.projector(records, { index: 0 }));