NgRx compound selector

Question

Is there a way to create a compound selector in NgRx?

Example:

export const paramSelector = (id) => createSelector(
  someState,
  state => state[id]
);

export const selectedId = createSelector(
  someOtherState,
  state => state.id
);

export const compoundSelector = createSelector(
  selectedId,
  id => paramSelector(id),
  state => state
);

Obviously above code doesn't work. Is there any way to get the desired result (last snipped)?

The idea is to have specialized parametrized selectors, and some higher level selectors consuming them. Imagine paramSelector is more complex. Sometimes you want to use paramSelector with specific parameters. Sometimes you don't want to provide params yourself, you want to get it somewhere from the store (eg. router state).

Now, you never want to repeat the same code, thus need for a compound selector.

Edit

Feature request was created. It can be found here.

@RenéWinkler I have updated question. I hope now it is more clear. — Bielik

timdeschryver timdeschryver · Accepted Answer · 2018-07-29T18:40:44

Your first snippet should work, the second wont - for more info I refer you to NgRx: Parameterized selectors.

For example:

export const selectCustomer = (id: string) => createSelector(
  getCustomers,
  customers => customers[id]
);

In one of the next releases it will be possible to add extra props to your selectors, as in:

export const getCustomerById = createSelector(
  getCustomers,
  (customers, props) => customers[props.id]
)

NgRx compound selector

Edit

1 Answers