我有一个允许您创建员工的应用程序,但我在重命名员工职位时遇到了问题。
我有一个位置数组,看起来像这样:
positions: [
{ id: 1, title: 'Masseuse' },
...
];
如果我创建一个员工,我必须从下拉列表中选择一个职位,员工最终看起来像这样:
employees: [
{ id: 1, name: 'John Doe', title: 'Masseuse' },
...
];
在用户重命名位置之前,此方法工作正常。例如,如果用户将“Masseuse”重命名为“Massage Therapist”,职位下拉列表将按预期更新,但担任该职位的员工仍会说“Masseuse”。
如果用户重命名一个职位,我是否还需要找到每个担任该职位的员工并分别更新他们?或者我应该采取不同的方法吗?我想知道员工对象是否应该存储职位 ID,因为它永远不会改变,然后以某种方式使用它来显示他们的职位名称,但我不知道这将如何工作。
我还没有后端开发或数据库架构方面的经验,所以这可能不是重要的信息,但我目前只是在使用假的 REST API。我最终会设置一个实际的数据库,但还没有做到这一点。
FWIW,我正在使用 Angular 和以下模拟 API:https://github.com/typicode/json-server
最佳答案
您可以使用职位 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
关于javascript - 更新在另一个对象中使用的对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54384485/