更新在另一个对象中使用的对象

Question

我有一个应用程序，可以让你创建员工，但我有一个问题，当重命名员工职位。

我有一系列的职位如下所示：

positions: [
  { id: 1, title: 'Masseuse' },
  ...
];

如果我创建了一个员工，我必须从下拉列表中选择一个职位，最后员工的结果如下：

employees: [
  { id: 1, name: 'John Doe', title: 'Masseuse' },
  ...
];

这种方法可以正常工作，直到用户重命名一个位置。例如，如果用户将“按摩师”重命名为“按摩师”，则该职位下拉列表将按预期更新，但该职位的员工仍然会说“按摩师”。

如果用户重命名一个职位，我是否也需要找到每个具有该职位的员工并单独更新他们？还是我应该采取的另一种方法？我想知道employee对象是否应该存储位置ID，因为它永远不会改变，然后以某种方式使用它来显示他们的职位标题，但我不知道这将如何工作。

我还没有经验的后端开发或数据库架构，所以这可能不是重要的信息，但我现在只使用一个假REST。我最终会建立一个实际的数据库，但还没有达到这个目的。

FWIW，我使用的是角和下面的模拟API：https://github.com/typicode/json-server

Answer 1

您可以使用职位id来存储标题。然后根据存储的位置id显示标题。

employees: [
 { id: 1, name: 'John Doe', titleId: 1 },
 ...
];

那么你的下楼就会像下面这样

<select [(ngModel)]="editingEmployee.titleId"">
  <option *ngFor="let x of positions" [value]="x.id">{{x.title}}</option>
</select>

现在，当您显示员工时，您可以引用员工存储的titleId中的职位数组。

<div *ngFor="let employee of employees">
   {{employee.name}} is a {{getPosition(employee.titleId)}}
</div>

在你的组件里

getPosition(titleId) {
  const position = this.positions.filter(p => p.id === titleId);

  return position[0] ? position[0].title : '';
}

请参阅此工作的stackblitz

Answer 2

推理得很好。

你所想的是正确的方法。

这与数据库规范化的概念是一致的，这是一种减少体系结构中冗余的结构化方法。

维基百科中的Se还数据库规范化：链接

Answer 3

一个可能的解决方案是在employee对象中存储一个职位id而不是标题。

当您需要显示它时，可以构造该对象的“视图”：

let positions = [
  { id: 1, title: 'Masseuse' },
  ...
];

let employees = [
  { id: 1, name: 'John Doe', positionId: 1 },
  ...
];

function getPositionTittle(id, positions) {
  const position = positions.find(p => p.id === id);

  if (!position) return '';

  return position.title;
}

function prepare(employee, positions) {
  const title = getPositionTittle(employee.positionId, positions);
  return {
    ...employee,
    title
  };
}

const employeeView = prepare(employees[0], positions);
// employeeView = { id: 1, name: 'John Doe', positionId: 1, title: 'Masseuse' }