Question

我想知道是否可以在选择角形材料2中隐藏所选的选项。所以我现在有这个：

<mat-form-field>
    <mat-select placeholder="{{ 'NAVBAR.LANG' | translate }}"  (change)="langSelected($event.value)" panelClass="panelResponsive">
        <mat-option *ngFor="let language of languages" [value]="language.value">
          <span>{{language.lang}}
            <span>
              <img src="{{language.img}}">
            </span>
          </span>
        </mat-option>
    </mat-select>
  </mat-form-field>

我的语言数组是：

languages = [
    {
        'lang': '',
        'value': 'es-ES',
        'img': '/assets/images/languages/spainIco.png',
        'alt': 'SP'
    }, {
        'lang': '',
        'value': 'en-GB',
        'img': '/assets/images/languages/ukIco.png',
        'alt': 'UK'
    }
];

我想做的是，如果我选择西班牙语，那么下次我打开下拉菜单时，只会显示英文选项，反之亦然。

谢谢大家。

Answer 1

当然，请使用getter过滤语言列表：

<Child doWhatever={this.changeWorld.bind(this , 'New world')} title={this.state.title}/>

get filteredLanguages() {
  return this.selectedLanguage ? 
    this.languages.filter(language => language.value !== this.selectedLanguage.value) : 
    this.languages;
}

在Mat-Select中隐藏选定的选项

1 个答案: