javascript - 如何清除 Angular 中组合框的选定值

Question

我有一个简单的 html 文件，其中包含 1 个组合框和 1 个清除按钮。我怎样才能使那个清除按钮在单击时清除组合框选定的值。这是我的代码:

mat-card-content fxLayout="row wrap" fxLayoutAlign="left" fxLayoutGap="30px">

          <mat-form-field fxFlex="30%">
            <mat-select placeholder="Choose Employer"
                        [(ngModel)]="customModel"
                        #activeEmployers="ngModel"
                        required>
              <mat-option *ngFor="let emp of employerList" [value]="emp.displayName">{{emp.displayName}}
              </mat-option>
            </mat-select>
          </mat-form-field>
        </mat-card-content>
        <mat-card-actions>
          <button type="button" class="get-button" (click)="getEmployers()">
            CLEAR
          </button>
        </mat-card-actions>
      </mat-card>

但是在这里，如果我使用

<button type="button" class="get-button" (click)="onClearSelected()">
                CLEAR
              </button>

在 ts 文件中:

onclear(){this.employerList=null}

然后它会清除组合框的所有选项。我怎样才能达到唯一选定的值并将其清除？

Answer 1

您需要清除[(ngModel)]的值。使用以下内容更改您的 onclear 函数

onclear(){this.customModel=null}

将雇主列表设置为未定义会清除您选择的选项。