Обновление объекта, который используется внутри другого объекта - PullRequest
Новая
       13

Обновление объекта, который используется внутри другого объекта

0 голосов
/ 27 января 2019

У меня есть приложение, которое позволяет вам создавать сотрудников, но у меня есть проблема при переименовании должностей сотрудников.

У меня есть массив позиций, который выглядит примерно так: 

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

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

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

Этот подход работает хорошо, пока пользователь не переименует должность.Например, если пользователь переименует «Массажистку» в «Массажист», раскрывающийся список должностей обновится, как и ожидалось, но сотрудники с этой позицией по-прежнему скажут «Массажистка».

Если пользователь переименует должность, мне также нужно найти каждого сотрудника на эту должность и обновить его индивидуально?Или есть другой подход, который я должен использовать?Мне интересно, должен ли объект сотрудника хранить идентификатор позиции, поскольку он никогда не изменится, а затем каким-то образом использовать его для отображения названия должности, но я не знаю, как это будет работать.

Я неУ меня еще есть опыт работы с бэкэнд-разработкой или архитектурой базы данных, так что это может быть не важной информацией, но в данный момент я использую только поддельный REST API.В конечном итоге я настрою реальную базу данных, но пока не добралась до этого.

FWIW, я использую Angular и следующий фиктивный API: https://github.com/typicode/json-server

Ответы [ 3 ]

0 голосов
/ 27 января 2019

Вы можете использовать идентификатор позиции, чтобы сохранить заголовок. А затем отобразить заголовок по сохраненному идентификатору позиции. 

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

0 голосов
/ 27 января 2019

Одним из возможных решений будет сохранение идентификатора позиции вместо заголовка внутри объекта сотрудника.

И когда вам нужно отобразить его, вы можете создать «вид» этого объекта: 

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' }
0 голосов
/ 27 января 2019

Хорошая аргументация.

То, что вы думаете, это правильный путь.

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

Se также нормализация базы данных в википедии: ссылка

...