如何更新或删除ngrx实体中的嵌套对象?

use*_*132 5 javascript rxjs ngrx angular ngrx-entity

例如,如何更新或删除ngrx实体中的嵌套对象,我想从(charter.entities.scopes.data)中删除具有19 id的第一个元素,如在我的ngrx存储中的以下存储的json对象中所示

 charter: {
      ids: [
        1
      ],
      entities: {
        '1': {
          id: 1,
          projectName: 'Some Project',
          projectCode: '899',
          projectUniqueCode: '674a9596-50ee',
          projectStatus: 'construction',
          budgetCode: 'CC34',
          projectTypeOne: 'Goods',
          projectTypeTwo: 'New',
          donorName: 'Elza Hills',
          scopes: {
            data: [
              {
                id: 19,
                module: 'Miss Cassandra Cartwright I',
                description: 'In tempore quia asperiores aut ea cum optio minima nemo est et aspernatur est repudiandae voluptas ipsum.',
                time: '2018-01-23 15:37:36'
              },

              {
                id: 43,
                module: 'Leanne Douglas',
                description: 'Occaecati facere eligendi esse esse nostrum in et vitae assumenda molestias omnis quis sit qui aut omnis est.',
                time: '2018-01-23 15:37:36'
              },
            ]
          },
          assumptions: {
            data: [
              {
                id: 29,
                assumption: 'Doloremque quo nihil minima ad optio perspiciatis asperiores debitis mollitia at debitis porro quia nam accusantium illo consequatur labore cum.',
                comments: 'Inventore ut pariatur id laboriosam recusandae soluta quo sunt impedit aut velit.'
              },
              {
                id: 164,
                assumption: 'Dolores quam aut possimus sint fugiat natus quos quaerat saepe facilis harum molestiae.',
                comments: 'Cumque quis magni illo dolore quas nam officiis dolores enim soluta doloribus in sed eum ut sunt.'
              },
            ]
          },
Run Code Online (Sandbox Code Playgroud)

减速器

export interface State extends EntityState<ProjectsCharter> {
  isLoading: boolean;
  isLoaded: boolean;
  selectedProjectsId: any;
}

export const adapter: EntityAdapter<ProjectsCharter> = createEntityAdapter({
  selectId: (state: ProjectsCharter) => state.id,
  sortComparer: false
});

export const initialState = adapter.getInitialState({
  isLoading: false,
  isLoaded: false,
  selectedProjectsId: null
});

export function reducer(state = initialState, action: CharterActions) {
  switch (action.type) {
    case CharterActionTypes.loadCharterSuccess:
      return {
        ...adapter.addOne(action.payload['data'], state),
        isLoading: false,
        isLoaded: true
      };
    case CharterActionTypes.updateScopeOnParent:
      const scopeEntity = { ...state.entities[action.payload.param] };
      scopeEntity.scopes.data = scopeEntity.scopes.data.map(item => {
        if (item.id === action.payload.id) {
          item.module = action.payload.module;
        }
        return item;
      });

      return {
        ...adapter.updateOne(scopeEntity, state)
      };
    default:
      return {
        ...state
      };
  }
}
Run Code Online (Sandbox Code Playgroud)

我可以更新和修改与该减速器nestad对象,但问题是1-这是一个有点复杂,也给我看在终端中编译时error TS2339: Property 'map' does not exist on type 'Scope'.Argument of type '{ id: string; projectName: string; projectStatus: string; projectCode: string; projectUniqueCode:...' is not assignable to parameter of type 'Update<ProjectsCharter>'.

Chr*_*ler 6

我强烈建议您更改商店并将其标准化。在这里看看:https : //redux.js.org/docs/recipes/reducers/NormalizingStateShape.html

使用这种方法,您将不需要复杂的化简器,如此处 https://redux.js.org/docs/recipes/reducers/UpdatingNormalizedData.html所述

对于以这种方式成形的商店,您将必须构建一个复杂的减速器。

  • 这些链接现在位于:[标准化状态形状](https://redux.js.org/recipes/structuring-reducers/normalizing-state-shape)和[更新标准化数据](https://redux.js)。 org/recipes/structuring-reducers/updating-normalized-data) (2认同)