CODEWITHSUNDEEP
typescriptreduxrxjsobservablengrx
Muj
Muj

Reputation: 132

How to create a non-memoized selector in NGRX. Don't want previous data

I want to toggle a menu, the first click expands the menu and I get the following state as expected.

{menuItem = {title: "Dashboard", urlFragment: "dashboard"}   //Toggle menu

When I click again on the menu, the subsciption get invoked two times with the current and previous state. So it stops on the debugger two times with the following states. I already tried release() method on the selector. it didn't work.

{menuItem = {title: "Userpage", urlFragment: "Userpage"}  //previous visited menu
{menuItem = {title: "Dashboard", urlFragment: "dashboard"} // My toggle menu

Is there any way to clear the cache and not get the previous state? I am getting this probably because my state doesn't changes. 

 this.subscriptions.push(this.store.pipe(select(getSelectedMenuItem)).subscribe(menuItem => {
            if (menuItem) {
                if (menuItem.iconCssClass === 'icons8-settings') {
                    this.showConfigurationMenu = !this.showConfigurationMenu;
                }
                else{
                    this.showConfigurationMenu=false;
                }
                debugger;
            }
       }

this is my selector

export const getSelectedMenuItem = createSelector(getMenu, (state: MenuState): IMenuItem => {
    if (state === 'loading') {
        return null;
    }
    return state.selectedMenuItem;
});

Upvotes: 0

Views: 840

Answers (1)

satanTime
satanTime

Reputation: 13584

Simply use a function that receives the whole state.

export const getSelectedMenuItem = (state: YourAppState) => {
  const featureState = getMenu(state);
  if (featureState === 'loading') {
    return null;
  }
  return featureState.selectedMenuItem;
};

Upvotes: 1

Related Questions