Angular 表格在重置后保持禁用状态

Question

我将下拉菜单设置为已禁用。但是，每次我重置表单 customerForm.reset() 时，下拉菜单都会启用，而不是禁用。

它在下面被硬编码为禁用 = true。

如何在每次重置后保持禁用状态？

<form [formGroup]="customerForm">
    <mat-form-field>
        <mat-label>Product List</mat-label>
        <mat-select
          formControlName="product"
          [disabled]="true">
             <mat-option>Select</mat-option>
             <mat-option
             *ngFor="let productItem of productList"
             [value]="productItem "
             >
             {{ productItem }}
             </mat-option>
        </mat-select>
    </mat-form-field>        

注意：希望保留表单中的值，如果可能，不使用 getRawValue。

Answer 1

在您的 clear/reset 函数中，您可以添加：

this.customerForm.controls['product'].disabled();

或

您可以在 formGroup

中初始化

customerForm = this.fb.group({
   product: [{value: '', disabled: true}]
});

并省略 mat-select

中的 [disabled]="true"