Question

当我在下拉列表中搜索时，如果没有结果，则显示未找到匹配项...但是当我重点关注时，添加了“未找到匹配项”作为选项。我该如何解决？

我在这里添加了代码和屏幕截图。

    <mat-form-field floatLabel="never" class="full-width transparent-form">
        <input matInput focused="'true'" type="text" [(ngModel)]="searchKey" autocomplete="off" (keydown)="inputKeyPressDown($event)" (keyup)="searchReportTo($event)"
            placeholder="Search Report To">
    </mat-form-field>
    <mat-option class="pointer-none" *ngIf="noResults">No match found</mat-option>

Answer 1

您在此处使用 mat-option 组件创建了错误消息。这就是将No Match found作为选项添加到选项数组中的原因。您可以使用简单的div来创建如下错误消息。

<div class="pointer-none" *ngIf="noResults">No match found</div>

希望获得帮助！

Answer 2

<mat-form-field class="example-full-width">
<input matInput placeholder="State" aria-label="State" [matAutocomplete]="auto" [formControl]="stateCtrl">
<mat-autocomplete #auto="matAutocomplete">
  <mat-option *ngFor="let state of filteredStates | async" [value]="state.name">
    <img class="example-option-img" aria-hidden [src]="state.flag" height="25">
    <span>{{state.name}}</span> |
    <small>Population: {{state.population}}</small>
  </mat-option>
  <mat-option *ngif="filteredStates.length == 0">No match found
  </mat-option>
</mat-autocomplete>

下拉搜索问题

2 个答案: