Angular 2 - 将嵌套的formbuilder标记为Touched

Question

我有以下问题:在我的应用程序中我有一个巨大的形式与嵌套的formbuilder,它工作得很好,但是当用户提交表单时,我想将完整的表单标记为Touched(运行验证),代码是

constructor(private fb: FormBuilder) {
    this.form= fb.group({
        field1: [null],
        field2: [null],
        nestedForm1: fb.group({
            field3: [null, Validators.required],
            field4: [null]
        }),
        nestedForm2: fb.group({
            field5: [null, Validators.required],
            field6: [null, Validators.required]
        })
    });
}

当我跑:

this.form.markAsTouched();

只有Field1和Field2被标记,有没有办法让我不知道这样做？

Answer 1

您可以创建如下自定义方法:

 setAsTouched(group: FormGroup | FormArray) {
  group.markAsTouched()
  for (let i in group.controls) {
    if (group.controls[i] instanceof FormControl) {
      group.controls[i].markAsTouched();
    } else {
      this.setAsTouched(group.controls[i]);
    }
   }
 }