Question

我还在努力学习ngrx - 商店已经安装完毕，一切似乎都运转良好。我正在使用的数据库是SQL，所以基本上我是“克隆”表并将它们加载到商店中，但在选择员工时最终加入状态会有问题。

员工实体看起来像这样：

export class Employee = {
  id: number;
  firstName: string;
  lastName: string;
  degreeId?: number;
  degree: Degree;
}

export class Degree = {
  id: number;
  description: string;
}

现在在我的组件中，我想让特定的员工显示如下：

{
  id: 1,
  firstName: George,
  lastName: Costanza,
  degreeId: 2,
  degree: {
    id: 2,
    description: 'College'
  }
}

我尝试创建一个合并这两个实体的选择器：

export const getEmployeeWithAllData = createSelector(
  getSelectedEmployee,
  getRelationalData,
  (employee, data) => {
    const employeesDegree = degree[employee.degreeId]
    employee.degree = employeesDegree

    return employee;
  }
);

如果我不使用ngrx-store-freeze，这似乎有效 - 因为我不知道我是否正确创建选择器或者如果ngrx-store-freeze有错误我问这个问题

当我这样做时，我是否真的在改变状态？

如果是，我如何从我的商店中选择他所拥有的所有关系数据的特定员工？

我正在做的事情并不是真的感觉不错。在我的实际应用中，员工有大约8个关联数据字段，我需要加入......

编辑：我忘了包含错误ngrx-store-freeze throws：

ERROR TypeError: Cannot assign to read only property 'degree' of object '[object Object]'
at eval (employee.selector.ts:85)
at eval (store.es5.js:602)
at memoized (store.es5.js:539)
at defaultStateFn (store.es5.js:573)
at eval (store.es5.js:605)
at MapSubscriber.memoized [as project] (store.es5.js:539)
at MapSubscriber._next (map.js:79)
at MapSubscriber.Subscriber.next (Subscriber.js:95)
at MapSubscriber._next (map.js:85)
at MapSubscriber.Subscriber.next (Subscriber.js:95)

Answer 1

是的，你试图改变状态。你可以像下面这样阻止这种情况

export const getEmployeeWithAllData = createSelector(
  getSelectedEmployee,
  getRelationalData,
  (employee, data) => {
    const emp = JSON.parse(JSON.stringify(employee)
    emp.degree = degree[employee.degreeId]

    return emp;
  }
)

如何正确合并我的演示组件的状态切片（ngrx / store）？

1 个答案: