如何在角度5中突出显示在<ng-select>和<ng-option>标记中选择的选项

时间:2018-10-01 06:33:41

标签: html angular

我有2个标签,当我单击下拉面板时,它会提供各种选项供选择,默认情况下会选择一个值,但是当我打开下拉面板时,它不会突出显示先前选择的选项。

我尝试在[selected]="filters"标记中添加[ng-selected]="filters"<ng-option>,但是这给我一个错误,因为它不是<ng-option>的已知属性

如何突出显示在下拉面板中选择的此选项?

<ng-select [(ngModel)]="filterSelected" name="in" id="fileterName" 
       (open)=droppanel() >
    <ng-option *ngFor="let opt of filterJSONData" [value]="opt.val" >
          {{ opt.content }}
    </ng-option>
</ng-select>

谢谢。

1 个答案:

答案 0 :(得分:1)

选择的定义应如下所示:

<ng-select
  [items]="filterJSONData"
  bindLabel="{{content}}" bindValue="{{val}}"
  [(ngModel)]="filterSelected">
  <ng-template ng-option-tmp let-item="item" let-search="searchTerm">
    <div [ngOptionHighlight]="search">{{ item.content }}</div>
  </ng-template>
</ng-select>

在选择区中键入文本时,匹配值显示为下划线。