Как сопоставить индексы ключей массива с другими именами ключей из элементов управления формы выпадающего списка?

Question

Мне нужно изменить имена ключей массива на другие, указанные пользователями, используя раскрывающиеся списки в качестве элементов управления формы реагирования.

Допустим, у меня есть следующий массив:

dataArray = [
    { id: 7854496, name: 'Peterson', gender: 'Male' },
    { id: 7054457, name: 'Peterson', gender: 'Female' },
    { id: 6954481, name: 'Peterson', gender: 'Female' },
];

пользователь выберет выпадающий список, связанный с идентификатором, и изменит его на другой, скажем, index и т. д. для остальных. Поэтому, когда пользователь нажимает кнопку с методом mapData(), массив должен выглядеть следующим образом:

dataArray = [
    { index: 7854496, familyName: 'Peterson', sex: 'Male' },
    { index: 7054457, familyName: 'Peterson', sex: 'Female' },
    { index: 6954481, familyName: 'Peterson', sex: 'Female' },
];

Вот метод mapData():

mapData() {
  this.odkDataIndexes.forEach((arrayIndexControl) => {
    let newIndex = this.indexesForm.get(arrayIndexControl).value;
    this.dataArray = this.dataArray.map((item) => {
      console.log(item);
      return {
        newIndex: item[arrayIndexControl]
      };
    });
  });
}

Я Делая это таким образом, потому что я сопоставляю одно поле другим, поэтому я могу выполнить миграцию из базы данных в другую, где массив должен иметь указанные c имена ключей массива.

Вот это stackblitz с полным кодом.

Answer 1

вы можете сделать что-то вроде этого

mapData() {    
    var newDataArray = [];
    this.dataArray.forEach(e=>{
      var newItem = {};
      this.odkDataIndexes.forEach((arrayIndexControl) =>{
        // console.log(e[arrayIndexControl]);
        newItem[this.indexesForm.get(arrayIndexControl).value] = e[arrayIndexControl];
      });
      newDataArray.push(newItem);
    });
    this.dataArray = newDataArray;
}