NGRX component store selector by parameter does not always fire

Viewed 390

I have an objects map structure that I keep in the component store:

{
   id1: {
    name: param1,
    value: 45
   },
   id2: {
    name: param2,
    value: 567
   }
}

I have selector:

objectsMap$: Observable<ObjectsMapModel> = this.select(
    (state) => state.objectsMap
);

and this works perfectly, fire every time I changed the structure of the whole map.

readonly setObjectMap = this.updater((state: MainStore, data: ObjectMapModel) => {
    return {
        ...state,
        objectMap: data
    };
});

I also have an updater which change the value of a single object:

 readonly setSingleObjectValue = this.updater((state: MainStore, data: ObjectModel) => {
    const objectMapWithNewValue = state.objectMap[data.id] = {...data}
    return {
        ...state,
        objectMap: objectMapWithNewValue 
    };
});

Now I need a selector per single object in the object map. I have a lot of objects here and it is not possible to create selectors one by one. For this purpose I found 3 ways:

  1. Solution which does not work and I do not understand why.

     objectById(id: string): Observable<ObjectModel> {
         return this.select(state => {
             // method never enter this line
             return state.objectMap[id]
         })
     }
     objectById$ = this.objectById;
    
  2. This solution works, but my reducer first needs to change the whole objectMap structure to fire objectMap selector first and after that change the reference/update value of my object. But changing the reference of the whole objectMap structure is not ok for me, I do not want that.

    objectById2(id: string): Observable<ObjectModel> {
         return this.select(this.objectsMap$,
         (objectsMap) => {
             return objectsMap[id];
         }
     )}
     objectById2$ = this.objectById2;
    
  3. The third solution I did to test, just for one object. It works fine but I do not need it since I want a dynamic method for object subscription by id (as 1) or 2) above).

    objectWithId1$: Observable<ObjectModel> = this.select(
        (state) => {
            return state.parameterDescription['id1']
        }
    )
    

2 and 3 works, but I do not need them. I do not understand why solution 1 does not work?

0 Answers
Related