Question

我希望使用角度材质控件创建复合形状控件（在角度连接https://youtu.be/CD_t3m2WMM8?t=1645处显示）。我提到在提交整个外部表单后在各个控件上显示错误消息的问题。材料正在使用父窗体组指令来检查窗体是否已提交，并驱动是否应显示错误消息。

我的复合表格

internalForm: FormGroup; // this form won't get submitted flag set to true when nested
constructor(fb: FormBuilder) {
     this.internalForm = fb.group({
       firstName: [],
       lastName:[]
     });
   }

<div [formGroup]="internalForm">
  <mat-form-field>
    <input matInput placeholder="First name" formControlName="firstName" minlength="5" required>
    <mat-error>Min length</mat-error>
  </mat-form-field>

  <mat-form-field>
    <input matInput placeholder="Last name" formControlName="lastName" minlength="5" required>
    <mat-error>Min length</mat-error>
  </mat-form-field>

</div>

然后我想用它

<h1>Composite Form</h1>
<form [formGroup]="form">
  <ss-name-field formControlName="name"></ss-name-field>
  <button type="submit">Submit</button>
</form>

解决方法是让我的复合表单不使用表单组，只是具有单独的表单控件。这样，材质控件可以到达并访问外部表单组以检查标志。它适用于上面的例子，但在我的真实世界场景中，我想要5个不同控件的复合表单控件，所以它会变得有点乱。

https://stackblitz.com/edit/angular-material2-issue-3vwszx

Angular复合表单提交了标志

0 个答案: