Question

我试图通过使用带有{names和QuestionBase []} - 对象的数组来扩展动态表单的Angular示例。 我在标准实现方面遇到0个问题，只有我自己的编辑。 我认为我在接收新的模型数据时没有遇到麻烦，但在创建FormGroup时，特别是关于属性：有效。希望你能在这里帮助我。
我收到以下错误消息：

DynamicFormQuestionComponent.html：13 ERROR TypeError：无法读取属性'有效'未定义（...）

和上下文

DynamicFormQuestionComponent.html：13 ERROR CONTEXT DebugContext_ {view：Object，nodeIndex：11，nodeDef：Object，elDef：Object，elView：Object}

这就是我在问题中添加的内容.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或我的部分的表单页面）：

<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。

提前致谢！

使用表单部件数组扩展Angular6动态表单示例

0 个答案: