我用的是最新版本的mat-select v 16。當(dāng)選擇了某個特定選項并單擊選擇下拉菜單時，所選選項不應(yīng)顯示在選項列表中。這就是我在html中使用的內(nèi)容。

<mat-form-field>
    <mat-select formControlName="value" selected="option1">
      <mat-option *ngFor="let item of options"
         [value]="item.value">{{ item.label }}</mat-option>
    </mat-select>
</mat-form-field>

項目包括選項1、選項2和選項3。

我需要使用什么，以便在選擇選項1時，只有選項2和選項3應(yīng)該顯示在下拉列表中？？

請回復(fù)！！蒂亞！！！

# # #你可以通過CSS添加一個類來隱藏選中的國家

<mat-form-field>
  <mat-select name="countryVaraible" [(value)]="selectedCountry" placeholder="Country">
    <mat-option *ngFor="let country of countries" [value]="country.short" [ngClass]="country.short === selectedCountry ? 'hidden' : ''">
      {{country.full}}
    </mat-option>
  </mat-select>
</mat-form-field>


.hidden{
display: none;
}

# # #試試這個:

1-在TypeScript組件中，將selectedOption變量聲明為空字符串，并創(chuàng)建一個方法來設(shè)置其值:

selectedOption: string = '';

setSelectedOption(option: string) {
  this.selectedOption = option;
}

2-在您的HTML中，使用此方法將選定的值分配給selectedOption

<mat-form-field>
    <mat-select formControlName="value" [(ngModel)]="selectedOption">
        <mat-option *ngFor="let item of options" [value]="item.value" (click)="setSelectedOption(item.value)">{{ item.label }}</mat-option>
    </mat-select>
</mat-form-field>

現(xiàn)在，當(dāng)您單擊一個選項時，setSelectedOption方法將被調(diào)用，以用選定的選項更新SelectedOption的值。