angular 6 动态生成表单 验证问题

Question

最近在做一个项目，点击左侧菜单，生成对应的表格，如下

，生成的表格可以 新增 一条数据，新增的form页如下：

，现在遇到一个问题，就是在 新增 form页，因为整个form页，是动态生成的，验证无法完成（本人目前能力有限）。我看 ng6 官方动态表单实例，虽然表单也是动态的，但是表单中的各项，都是同一个类的实例，并且用了
ts：

export class DynamicFormQuestionComponent {
  @Input() question: QuestionBase<any>;
  @Input() form: FormGroup;
  get isValid() { return this.form.controls[this.question.key].valid; }
}

html：

<div >
  <input  [formControlName]="question.key" [id]="question.key" [type]="question.type">
</div> 
<div class="errorMessage" *ngIf="!isValid">{{question.label}} is required</div>

，我想请问，在ts文件中，1.get isValid() 函数的作用，2.以及为什么在form表单中输入数
据时，get isValid()函数会将所有的input控件轮询一遍，this.question.key为什么能够
在轮询的时候切换QuestionBase类中的属性；3.如果现在表单中的数据完全动态（即不是QuestionBase的实例），那么该怎样去验证表单中的数据？

Answer 1

1.get isValid() 函数的作用，
判断表单提交前是否合理，合理的话返回一个true。所以*ngIf="!isValid"就是不合理会显示提示。
比方有时候form是内嵌在modal里的，没有submit按钮，所以得在(nzOnOk)="submitForm()"中判断一次。

if(!this.isValid){
      return;
    }

2.[this.question.key]不是写死的，所以可以动态查找阿。

3.完全动态就是遍历插入

const group = this.fb.group({});
this.config.forEach(control => group.addControl(control.name, this.fb.control('')));