угловой 5, как создать элемент динамического ключа в объекте formBuilder.group

Question

Я пытаюсь перебрать список полей ввода на основе моего исходного http-объекта ответа.

Я использую реактивную форму в своем приложении, поэтому при итерации объектов элемента формы в пользовательском интерфейсе, как генерировать динамический ключв моем объекте formBuilder.group?так что будет легко обрабатывать все мои данные элемента формы при отправке, как если бы мы сохранили его статические данные.

Пожалуйста, обратитесь к ниже отмеченному stackblitz:

    // service response data
    this. formData=[
        {name: krish, email: test@gmail.com},
        {name:anand, email: teat2@gmail}
     ]

    // how to generate dynamic key in formbuilder group object ?
    this.homeDetails = this.formBuilder.group({
      krish:['', Validators.required],
      anand:['', Validators.required]
    });

выше для объекта группы forBuilder какитерировать и задавать значения ключей krish / anad динамически?Это какой-либо способ генерировать как для цикла FormBuilder.group объект с ключом, поскольку он основан на динамическом отклике службы ..?

См. URL: https://stackblitz.com/edit/angular-router-example-dynamic-formcontrolname-rtmsqz?file=app%2Fhome%2Fhome.component.ts

Answer 1

Попробуйте это.это будет работать

      *Declare formgroup variable* 

          homeDetails: FormGroup;

     // service response data
              this. formData=[
                    {name: krish, email: test@gmail.com},
                    {name:anand, email: teat2@gmail}
                 ]
         this.homeDetails = this.fb.group({});

            let formControlFields = [];
        for (let k = 0; k < this.formData.length; k++) {
                formControlFields.push({ name: this.formData[k].name, control: new FormControl('', Validators.required) });
              }

    formControlFields.forEach(f => this.homeDetails.addControl(f.name, f.control));