角度材料 => 表单验证，但一个条件字段除外

Question

在我的角度形式中，我有一个选择字段接受是/否值，另一个字段仅在用户选择"是"时才出现。HTML代码如下，

<form [formGroup]="Form">
<mat-form-field>
<mat-label>Is Permitted</mat-label>
<mat-select [(value)]="perm" [formControl]="permission" required>
<mat-option value="No">No</mat-option>
<mat-option value="Yes">Yes</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field class="form-element" *ngIf="perm=='Yes'">
<input matInput placeholder="Pass Number" formControlName="passnum" required autocomplete="off">
<mat-error *ngIf="passnum.touched && !passnum.required">
Pass Number is required.
</mat-error>
</mat-form-field>
</form>
<button mat-raised-button color="primary" type="button" (click)="Save();" [disabled]="!Form.form.valid">SAVE</button>

这是有效的，但问题出在保存按钮上。由于我希望仅在表单处于有效状态时才启用按钮，但如果用户选择否，则不会显示第二个字段并且表单无效，因此未启用 SAVE 按钮。从技术上讲，仅当第二个字段验证显示为"时，才应考虑第二个字段验证。

我的字段创建为

permission: new FormControl('No'),
passnum: new FormControl()

请建议如何实现此目的。

Answer 1

在创建窗体的位置，逻辑可能如下所示。表单无效的原因是，无论第一个字段如何，您都使第二个字段为必填字段。

如果第二个字段是必需的，当且仅当第一个字段为"是"，则@Igor的评论可能有效。

private buildForm(): void {
this.yourForm = this.formBuilder.group({
permission: ['', Validators.compose([Validators.required])],
passNum:: ['']
});