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

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"}]

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