Question

在这种情况下，如何将下拉列表显示在datalist内部并填充数据？

<input class="header-filter-search" (change)='onTaxpayerChosen($event)' [(ngModel)]="searchValue" placeholder=" Search accounts" type="text" (blur)="searchForUser()" [formControl]="query" list="accounts" id="account"/>
          <datalist id="accounts">
              <option *ngFor="let account of taxpayerList">{{account.name}}</option>
          </datalist>

当前，一旦选项被填满，我现在必须选择一个小箭头来显示下拉菜单，但是我看不到在线可以自动显示这种格式的下拉菜单的任何内容？

Answer 1

使用*ngIf="taxpayerList"语句。这意味着您的dataList将不会被渲染，直到taxpayerList不会被填充：

 <datalist id="productList">
   <select *ngIf="taxpayerList">
    <option *ngFor="let account of taxpayerList">
        {{account.name}} 
    </option>
   </select>
 </datalist>

更新：

<p>Debug info: taxpayerList {{ taxpayerList | json }}</p>
<select>
    <option *ngFor="let account of taxpayerList" [value]="account.name"></option>
</select>

Answer 2

      <datalist id="accounts" open>
          <option *ngFor="let account of taxpayerList">{{account.name}}</option>
      </datalist>

显示箭头

如何自动显示数据列表的下拉列表？

2 个答案: