Автор оригинала: vishnu siddareddy.
У меня есть несколько полей формы и хотите добавить больше поля динамически, которые исходят с другого представления (где пользователь может ввести тип поля, длина и имя и имя формы), мне нужно создать поля формы, используя эти значения.
Некоторые, как мне удалось построить одно поле (Textbox Name – это «один»), но если я попытаюсь добавить другое поле (Textbox Name – это «два»), получая следующую ошибку, «|» Ошибка ошибки: не может найти управление с пути: «Newfields -> 0 -> два»
ISSUECOMPONENT.HTML
ISSUECOMPONENT.TS.
import { Component, ViewEncapsulation, Pipe, PipeTransform, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators, FormControl, FormArray } from '@angular/forms';
import { ModalComponent } from '../../modal/modal.component';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'viewhistory',
templateUrl: './issuecomponent.html',
})
export class IssuerTestcaseExecution implements OnInit {
issuerTestCaseFrm: FormGroup;
fields: any;
fieldProps: any;
formControls = {};
constructor(
private fb: FormBuilder,
public modalService: NgbModal,
) {
this.issuerTestCaseFrm = fb.group({
'IssuerReferenceNumber': ['', Validators.required],
'newfields': fb.array([]),
});
}
initNewFields(): FormGroup {
this.fieldProps.forEach(prop => {
this.formControls[prop] = [this.fields[prop].value, Validators.required];
});
return this.fb.group(this.formControls);
}
//Assuming these results coming from modal view after add button click
addNewInputField(): void {
const modalRef = this.modalService.open(ModalComponent);
modalRef.result.then((result) => {
this.fields = {
[result.fieldname]: {
type: result.fieldtype,
value: result.fieldvalue,
label: result.fieldname,
},
};
this.fieldProps = Object.keys(this.fields);
const control = this.issuerTestCaseFrm.controls.newfields;
control.push(this.initNewFields());
}, (reason) => {
});
}
}
Начните писать здесь …