angular - 如何为 ngSelect 选项添加工具提示？在将选项悬停在下拉列表中时，我需要显示工具提示

Question

    <ng-select [items]="cities"
               bindLabel="name"
               placeholder="Select city"
               [(ngModel)]="selectedCity">
    </ng-select>

如何为 ngSelect 选项添加工具提示？在将选项悬停在下拉列表中时，我需要显示工具提示。

标签： angular

Answer 1

使用选项模板，您可以在这些模板中添加工具提示。

在下面的示例中，我使用 HTML 属性title来显示工具提示，如果您使用像 ng-bootstrap 这样的库，那么您可以使用该库中的工具提示功能。

<ng-select [items]="cities" [(ngModel)]="selectedCity" bindLabel="name" bindValue="name">
    <ng-template ng-option-tmp let-item="item" let-index="index" let-search="searchTerm">
       <span title="A sample info in tooltip">{{item.name}}</span>
    </ng-template>
</ng-select>