如何在单击时将垫子选择重置为初始状态？

Question

我正在使用Mat-Select带有Mat-Option，但是我想重置Mat-Option在单击按钮时选择的。因此，我不仅将其值设置为null，我希望该选项在屏幕上显示没有值。

示例：

<div ngIf="listAccounts">
  <mat-select [(value)]="accountSelected">
     <mat-option>Select an option... </mat-option>
     <mat-option [value]="account" *ngFor="let account of listOfAccounts" (click)="yourFunction(account)"> 
       Account {{account.accountNumber}} Agency {{account.agencyNumber}} Digit{{account.digitNumber}} 
     </mat-option>
</mat-select>
<div>
<button (click)="listedAccounts = !listedAccounts"> Button </button>

每次我单击按钮时，我都想Mat-Option转到“选择一个选项...”或一个空选项。

Answer 1

只需将空值设置为accountsclected，然后在mat-option中更改

<mat-option value=''>Select an option... </mat-option>

Answer 2

将初始值添加到“重置”按钮上单击的单击使用多选择下拉

html

          <mat-select
            placeholder="{{ generalAppSettings?.filterVariables?.regionText }}"
            (selectionChange)="onRegionChange($event)"
            class="dropdownFilters"
            *ngIf="generalAppSettings.filterVariables.showRegionFilter"
            [(value)]="regionValue"
          >
            <mat-option
              *ngFor="
                let option of generalAppSettings.filterVariables?.continents
              "
              [value]="option.region"
            >
              {{ option.region }}
            </mat-option>
          </mat-select>

          <mat-select
            placeholder="{{ generalAppSettings?.filterVariables?.countryText }}"
            (selectionChange)="onCountryChange($event)"
            class="dropdownFilters"
            *ngIf="generalAppSettings.filterVariables.showRegionFilter"
            [(value)]="initialCountryValue"
          >
            <mat-option *ngFor="let country of countryValue" [value]="country">
              {{ country }}
            </mat-option>
          </mat-select>

      <button
        class="btn btn--primary mat-button-cta"
        (click)="clearFilters()"
      >
        {{ generalAppSettings.filterVariables.resetInfo }}
      </button>

typescript

clearFilters(): void {
    this.initialCountryValue = '';
    this.regionValue = '';
  }