Question

当用户单击按钮时，我有一个包含表单数组的反应性表单，新的表单组被推到表单数组。当用户提交表单时，我要验证那些动态字段是否为空 2未执行。我在这里做错了什么？其他领域正在按我的预期工作。此问题仅在动态字段中发生。

Female

此方法用于在用户单击按钮时创建动态表单字段

{
  "salesPersonId": 13,
  "name": "testName",
  "gender": 1,
  "phone1": "34986215",
  "phone2": "string",
  "email": "testingEmail@example.com",
  "team": "Bravo",
  "teamLeader": "Delta",
  "countyId": 1,
  "county": null,
  "subCountyId": 1,
  "subCounty": null,
  "address": "House 108",
  "additionalInfo": "He Drinks tea",
  "input1": "string",
  "input2": "string"
}

这是我用来获取模板字段的简单吸气剂

 <mat-form-field appearance="outline" fxFlex="33" class="pr-4">
    <mat-label>Gender</mat-label>
    <mat-select formControlName="gender">
        <mat-option value="1">1</mat-option>
        <mat-option value="2">2</mat-option>

    </mat-select>
</mat-form-field>

当用户单击按钮时，此方法将执行

room.errors?.required

模板

    this.formBuilder.group({
      email: ["", [Validators.required, Validators.email]],
      description: ["", [Validators.required, Validators.maxLength(300)]],
      roomTypes: this.formBuilder.array([this.createRoomTypeFeild(),this.createRoomTypeFeild()
      ]),
    });

Answer 1

在您的代码中，您使用了 room.errors？.required ，但是room只是一个表单控件名称。您需要正确引用它：

extraRoomTypes.controls[i].get('room')?.hasError('required')

或

extraRoomTypes.controls[i].get('room')?.errors?.required

Answer 2

根据您提供的信息：

<tr formArrayName="roomTypes" *ngFor="let roomType of extraRoomTypes.controls;let i = index">

应该像：

 <tr formArrayName="roomTypes" *ngFor="let roomType of hospitalForm.controls.roomTypes.controls;let i = index">

对于消息，请尝试：

 <div *ngIf="isSubmitted && roomTypes.controls.room.errors?.required" class="error-msg">
       is required
 </div>

反应性表单动态字段验证不适用于<选择>

2 个答案: