React to changes in route in @ngrx/component-store

296 Views Asked by At

We have a component that shows a list of items. A new requirement demands that a certain item should be selected within the list - arriving from another component. (We came up with using the route for this.)

So a teammate implemented the following to retrieve the id of the item to be selected from the ActivatedRoute:

this.currentVorgangIdByRoute$.currentRoute.queryParamMap.pipe(
    map((params: ParamMap) => String(params.get('id'))),
    filter(id => id !== null));

...

this.currentVorgangIdByRoute$.subscribe(x => this.vorgangId = x));

...

const item = items.find(x => x.item_id === this.itemId);
this.setSelectedItem(item);

On loading the list of items - we determine the one to be selected.

I would like to switch to ngrx/component-store and wondered how selecting an item via its route would be done there. I've found ngrx/router-store for ngrx/store, but I found nothing about combining routeing with ngrx/component-store.

How would the current route be processed in the component-store to deliver the selected item?
Would e.g. ActivatedRoute be part of the store and be combined (combineLatest?) with the list of items to determine the selected item?
Would routing-related code be still in the component - or would everything be in the store?

0

There are 0 best solutions below