Javascript 如何使用材质显示/隐藏dropdownlist

所以我用的是角8。我有两个下拉列表。其中包含已填充数据的。还有一个是来自服务器的数据。但是现在，如果下拉列表显示的是来自服务器的选定数据，那么我想隐藏包含已填充数据的下拉列表

使用选定的数据

      <div  class="search-select searchoptions" *ngIf="selectedSearch && hasOtherOptions(selectedSearch)">
        <mat-select placeholder="Opties" name="option"  [(ngModel)] = "selectedValue" >
          <mat-option  *ngFor="let option of getOtherOptions(selectedSearch)" [value]="option.apiStatus" >
            {{ option.status }}
          </mat-option>
        </mat-select>
      </div>

当然，这需要重构。但这是以后的情况

因此，当选择QrCode选项时，必须隐藏带有选定数据的下拉列表，反之亦然。因此，当选择Doelen选项时，必须隐藏包含服务器数据的Dropdownlist

但是如何归档呢

---

谢谢

您可以设置一个

布尔值

来显示/隐藏下拉列表

showDropdown:boolean=false

searchFor() {
    this.showDropdown = false;

    if (this.selectedSearch === 'Registratie') {
      this.filerByRegistration();
    }
    ...
}

filerByRegistration(){
  ...
  // after data is fetched
  this.showDropdown = true;
}

模板：

<div class="search-select searchoptions" *ngIf="showDropdown && selectedSearch && hasOtherOptions(selectedSearch)">
  <mat-select placeholder="Opties" name="option" [(ngModel)] = "selectedValueOptie" 
    ...
  </mat-select>
</div>

*ngIf变量必须是布尔值才能检查条件。感谢您的answare。为什么要注册文件？它是由qrcode提供的，只是从您的if条件中选取了第一个示例不是100%，因为如果选择了doelen，则必须隐藏api调用的下拉列表。因此，如果选择了doelen，则必须隐藏来自服务器的下拉列表，如果选择了qrcode，则必须显示来自服务器的下拉列表，并且必须隐藏来自doelen的下拉列表隐藏链接未打开
searchFor() {
    this.showDropdown = false;

    if (this.selectedSearch === 'Registratie') {
      this.filerByRegistration();
    }
    ...
}

filerByRegistration(){
  ...
  // after data is fetched
  this.showDropdown = true;
}

<div class="search-select searchoptions" *ngIf="showDropdown && selectedSearch && hasOtherOptions(selectedSearch)">
  <mat-select placeholder="Opties" name="option" [(ngModel)] = "selectedValueOptie" 
    ...
  </mat-select>
</div>