为多个输入字段创建一个 FormControl

Question

我有一个表单，其中包含可变数量的输入字段。它们都如下所示。

<mat-form-field style="width: 100%;">
   <input  matInput placeholder="" type="text"
           [formControl]="mFormControl">
</mat-form-field>

我的表单控件如下所示：

mFormControl = new FormControl('', [
    Validators.pattern("mypattern")
]);`

问题是，当只有一个输入字段出错时，表单控件会验证每个输入字段是否错误。我希望只有包含错误文本的输入字段被标记为错误。

有人知道如何存档吗？

Answer 1

尝试使用 FormBuilder

HTML

<mat-form-field [formGroup]="mFormGroup" style="width: 100%;">
   <input  matInput placeholder="" type="text"
           [formControl]="mFormGroup.controls['firstName']">
</mat-form-field>

打字稿

this.mFormGroup = formBuilder.group({
                        firstName: [null, Validators.compose([Validators.required])]
                  });