Магазин Ngrx: есть ли способ получить разницу в состояниях после выполнения какого-либо действия - PullRequest
Новая
       7

Магазин Ngrx: есть ли способ получить разницу в состояниях после выполнения какого-либо действия

0 голосов
/ 03 июля 2018

Я использую хранилище ngrx для сложной структуры хранилища, как показано в коде:

model.ts 

export interface ITableState {
    tables: ITables,
    selectedTableId: number
}

export interface ITables {
    [id: number]: ITable
}


export interface ITable {
    menus: IMenus,
    selectedMenuId: string
}

export interface IMenus {
    dishId: number,
    dishName: string
}

reducer.ts 

    case tables.ActionTypes.ADD_MENU: {
      var menuToAdd = <IAddMenu>action.payload;
      return {
        ...state,
        tables: {
          ...state.tables,
          [menuToAdd.tableId]: {
            ...state.tables[menuToAdd.tableId],
            menus: {
              ...state.tables[menuToAdd.tableId].menus,
              [menuToAdd.menuId]: menuToAdd.menu
            }
          }
        }
      }
    }

Я подписываюсь на этот магазин, как показано ниже: 

    export const getTableStructureState = (state: State) => state.table;

public tableStructureState$ = this.appState$.select(store.getTableStructureState);

 this.tableSandbox.tableStructureState$.subscribe(tableDataState => {
 console.log(tableDataState.tables[tableDataState.selectedTableId].menus)
 });

Итак, выполнив действие ADD_MENU, я получаю все меню в магазине. Но мой вопрос

если предположить, что я добавил два меню, а затем снова я добавил третье меню есть ли способ узнать, какое меню было последним добавлено. или простыми словами, какие изменения произошли в государстве.

Я много искал, но не нашел решения. Пожалуйста, дайте мне знать, если это возможно или нет. Заранее спасибо за помощь.

1 Ответ

0 голосов
/ 03 июля 2018

Вы можете оставить в своем магазине, например, свойство lastChange или историю изменений ...
Затем создайте селектор, который возвращает последнее изменение. Таким образом, вы будете использовать мощный NgRx. 

export interface ITableState {
    tables: ITables,
    selectedTableId: number,
    lastChange: IAddMenu
}

case tables.ActionTypes.ADD_MENU: {
  var menuToAdd = <IAddMenu>action.payload;

  // what was the previous change ?
  const previousChange = state.lastChange;
  if (previousChange.xxxxx) {
    // do something depending on last change... 
    ...
  }

  return {
    ...state,
    tables: {
      ...
    },
    lastChange: action.payload  // store new last change
  }
}

Надеюсь, это поможет вам.

...