如何在@ ng-select/ng-select选项上显示工具提示 [英] How to show tooltip on @ng-select/ng-select options

查看:221
本文介绍了如何在@ ng-select/ng-select选项上显示工具提示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在应用程序中使用@ ng-select/ng-select @ 2.3.6,并且数组中有很长的文本.

I am using @ng-select/ng-select@2.3.6 in my application and i have a very long text in array.

因此,完整的文本在下拉列表中不可见,因此我想在每个选项上显示标题/工具提示

So, the complete text not visible in dropdown list so I want to show the title/ tooltip over the each and every options

我尝试过

let listArray = [{name: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s'}];

<ng-select placeholder="Select" (change)="onChange($event)">
      <ng-option *ngFor="let list of listArray" 
       title="{{list.name}}"> {{list.name}} </ng-option>
 </ng-select>

但是没有运气

推荐答案

您可以使用以下代码实现工具提示解决方案

you can achieve tooltip solution using below code

<ng-select [items]="listArray" bindLabel="name" bindValue="name">
    <ng-template ng-option-tmp let-item="item">
    <div title="{{item.name}}">{{item.name}}</div>
    </ng-template>
</ng-select>

谢谢

这篇关于如何在@ ng-select/ng-select选项上显示工具提示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆