文本溢出的角度选择工具提示答案

【问题标题】：Angular select tooltip for text overflow文本溢出的角度选择工具提示
【发布时间】：2016-02-18 01:35:59
【问题描述】：

我有一个如下所示的选择：

<select id="select-full"
    title="Make selection"
    class="form-control form-custom input-sm"
    name="Select"
    ng-model="form.select"
    ng-options="select.displayName as select.text for select in selects | orderBy:'text'">
    <option value="">Any</option>
</select>

由 ng-options 填充的一些文本很长，因此我计划让那些会导致溢出的文本带有尾随省略号。

但我想知道，另外，是否有一种方法可以使鼠标悬停在选择中的一个选项上以使工具提示显示完整条目？这样用户就可以在做出选择之前检查完整的条目。无论是在 HTML 还是 Angular 控制器中都无所谓。

如果没有办法，那是一个很好的答案，但是做一些搜索并没有得到答案，我想在这里做的事情是否可行。

谢谢！

【问题讨论】：

我猜你确实回答了这个问题，哈哈。你知道该怎么做吗？
当然，我可以帮你解决所有问题，下次我什么时候有空:) 请告诉我们你的尝试。

标签： html angularjs select tooltip

【解决方案1】：

您可以将 uib-tooltip 用作：

<span tooltip-append-to-body="true"  uib-tooltip="{{select.displayName}}" tooltip-placement="right">{{select.displayName}}</span>

这里 tooltip-append-to-body="true" 会将您的工具提示移动到父范围，这样它就不会在选择 div 中被截断。

通过Uib Angular了解更多信息

【讨论】：