Question

我在下拉菜单中使用了ng-select，当用户将鼠标悬停在下拉列表上时，它应该显示工具提示。 代码：

<label>Grouping</label>
  <ng-select [items]="accounts"
            bindLabel="name"
            bindValue="name"
            groupBy="country"
            [(ngModel)]="selectedAccount">
  </ng-select>

组件

 accounts = [
    { name: 'Adam', email: 'adam@email.com', age: 12, country: 'United States' },
    { name: 'Samantha', email: 'samantha@email.com', age: 30, country: 'United States' },
    { name: 'Amalie', email: 'amalie@email.com', age: 12, country: 'Argentina' },
    { name: 'Estefanía', email: 'estefania@email.com', age: 21, country: 'Argentina' },
    { name: 'Adrian', email: 'adrian@email.com', age: 21, country: 'Ecuador' },
    { name: 'Wladimir', email: 'wladimir@email.com', age: 30, country: 'Ecuador' },
    { name: 'Natasha', email: 'natasha@email.com', age: 54, country: 'Ecuador' }

];

注意： 我需要ng-select下拉列表中的工具提示。

我尝试使用 title 属性，但是不起作用。

示例：

当用户将鼠标悬停在下拉列表上时，需要显示工具提示。

问题

如何使用angular5在ng-select中添加tootip？

您的建议将对我有所帮助。

Answer 1

使用*ngFor创建options并为选项提供所需的工具提示。check this Example

Answer 2

您可以使用ng-template来实现

select t.*
from transactions t
where t.orign_txn_id is not null
union all
select t.*
from transactions t
where t.txn_id in (select t2.orign_txn_id
                   from transactions t2
                  );

在angular 5中使用ng-select时如何添加工具提示？

2 个答案: