ngrx: how to pass parameters to selector inside createSelector method

Question

I have a very simple state in my store:

const state = {  records: [1,2,3], }; 

I have a selector for records:

export const getRecords = createSelector(getState, (state: State) => state.records)); 

And what I want now is to have separate selectors for fetching each record by index. For this purpose I want to create one generic selector with props in this way:

export const getRecordByIndex = createSelector( getRecords, (state: State, { index }) => state.records[index]), ); 

And after that create a couple of specific selectors e. g.:

export const getFirstRecord = createSelector( getRecordByIndex(/* somehow pass index = 0 to this selector */), (firstRecord) => firstRecord), ); 

But I didn't find any mention how to pass parameters to selectors with props when we use them inside createSelector method. Is it possible?

Answer 1

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

As of NgRx 6.1 selectors also accepts an extra props argument. Which means 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.