Question

我有一个下拉列表，我想在选择下拉列表时显示数据。

如果我将函数放在ngOnInit中，它将起作用：

 ngOnInit() {
    this.returnQrCodes$ = this.qrDefinitonService.getDefinitionForSelection().pipe(tap(console.log));
  }

但是，如果您没有选择下拉列表，那么我当然不想加载数据。但是，如果我为此做一个功能：

  getQrCodes() {
    this.returnQrCodes$ = this.qrDefinitonService.getDefinitionForSelection().pipe(tap(console.log));
  }

模板如下：


   <div
      class="search-select searchoptions" *ngIf="selectedSearch && hasOtherOptions(selectedSearch)">
      <mat-select placeholder="Opties" name="option" [(ngModel)] = "selectedValueOptie" >
        <mat-option  *ngFor="let option of returnQrCodes$ | async " value="option.value" >
          {{ option.qrCode }}
        </mat-option>
      </mat-select>
    </div>

并且我选择下拉列表没有任何反应。

谢谢

我尝试过这样：

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

我也这样尝试过：

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

我尝试过这样：

 <div class="search-select searchoptions" *ngIf="selectedSearch && hasOtherOptions(selectedSearch)">
      <mat-select placeholder="Opties" name="option" [(ngModel)] = "selectedValueOptie" (change)="getQrCodes()"  >
        <mat-option  *ngFor="let option of returnQrCodes$ | async " value="option.value" >
          {{ option.qrCode }}
        </mat-option>
      </mat-select>
    </div>

这是方法：


 getQrCodes() {
    this.returnQrCodes$ = this.qrDefinitonService.getDefinitionForSelection().pipe(tap(console.log));
  }

Answer 1

似乎您没有在任何地方调用“ getQrCodes（）”函数

如果在Angular中选择下拉列表，如何显示材料下拉列表中的数据？

1 个答案: