Угловая форма слияния данных из выбранных выпадающих меню

Question

Как объединить значения из выпадающих меню в массив объектов?Существует два раскрывающихся меню (лица и страны) с предварительно заполненными значениями

, поэтому при назначении страны человеку я пытаюсь получить данные в массиве объектов, таких как: [{person: 'John', country: 'USA'}, {person: 'Pablo', country: 'Mexico'}] на основе выбора пользователя.

Я пытаюсь с FormArray, но я делаю что-то не так

Stackblitz

Answer 1

Вам необходимо добавить форму FormGroup к базе данных FormArray на основе данных о количестве людей, поэтому, если у вас есть два человека, вам нужно создать две группы FormGroup

, например,

this.selectForm = this.formBuilder.group({
  persons: this.formBuilder.array([
    this.formBuilder.group({
      'person': '',
      'country': ''
    }),
    this.formBuilder.group({
      'person': '',
      'country': ''
    })
  ])
});

или увеличитьformGroup основывается на людях

this.selectForm = this.formBuilder.group({
  persons: this.formBuilder.array(this.getFormGroupByN(this.personsData.length)
  )
});


getFormGroupByN(n: number) {
  let result = []
  for (let i = 0; i < n; i++) {
    result.push(this.formBuilder.group({
      'person': '',
      'country': ''
    })
    );
  } // for end 

  return result;
}

Я создал переменную для хранения данных лиц с кодом personsData, так что Ican бросить цикл и создать элемент параметра

this.personsData = this.parts.map(part => part.persons).reduce((r, part, []) => r.concat(part));

результат теперь выглядит следующим образомэто

[{"person":"John","country":"USA"},{"person":"Pablo","country":"Mexico"}]

демонстрация стекаблиц