Я попытался расширить угловой пример динамических форм, используя массив с {names и QuestionBase []} - объектами. У меня 0 проблем со стандартной реализацией, только с моими собственными правками. Думаю, у меня не проблемы при получении новых данных макета, а при создании FormGroup, особенно в отношении свойства:действительный из этого.Надеюсь, вы мне поможете.
Я получаю следующее сообщение об ошибке:
DynamicFormQuestionComponent.html: 13 ОШИБКА TypeError: Невозможно прочитать свойство 'valid' из undefined (…)
И контекст
DynamicFormQuestionComponent.html: 13 КОНТЕКСТ ОШИБКИ DebugContext_ {view: Object, nodeIndex: 11, nodeDef: Object, elDef: Object, elView: Object}
Вот что я добавил в question.service.ts:
getDummies() {
let questions: QuestionBase<any>[] = [
new DropdownQuestion({
key: 'brave2',
label: 'Bravery Rating',
options: [
{key: 'solid', value: 'Solid'},
{key: 'great', value: 'Great'},
{key: 'good', value: 'Good'},
{key: 'unproven', value: 'Unproven'}
],
order: 20
})];
let questions2: QuestionBase<any>[] = [
new TextboxQuestion( {
key: 'BG',
label: 'Begründung',
value: '',
required: true,
order: 3
})
];
let object = [{name: 'test',data: questions2},
{name: 'test2', data: questions}];
return object;
В моем компоненте я изменил в шаблоне (который показан, поэтому app.component.html или form-page длямоя часть):
<app-dynamic-forms [questions]="questions" [dummies]="dummies"></app-dynamic-forms>
и в .ts:
dummies: any ;
и особенно в конструкторе:
this.dummies = service.getDummies();
dynamic-forms.component.ts (да, я изменил имя всего компонента, добавив «s»):
@Input() dummies: any[] = [];
form2: FormGroup;
ngOnInit:
for (let i = 0; i < this.dummies.length; i++){
this.form2 = this.qcs.toFormGroup(this.dummies[i].data);
шаблон (добавил это в -tag):
<div *ngFor="let dummy of dummies, let i = index">
<h3>{{dummy.name}}</h3>
<p>{{dummy.data}}</p>
<app-question [question]="dummy.data[i]" [form]="form2"> </app-question>
</div>
Я добавил все соответствующие файлы к этому Plunker .
Заранее спасибо!