Question

我想添加一个工具提示，该工具提示将显示在以下元素的鼠标悬停中。

<a ng-click="click(this)">
<span class="icon"></span>
</a>
{{product.title}}

我在product.desc中有工具提示。我尝试使用以下代码：

 <span tooltip="{{product.desc}}" class="glyphicon"></span>

但这不起作用。任何想法/建议？请帮忙。

[编辑]当我使用开发人员工具检查时，我可以看到product.desc的值在页面源中按预期存在。

三江源

Answer 1

您使用的是哪种角度？可能会发生一些事情......过去9个月我一直在开发角度应用程序，所有这些应用程序都利用了工具提示库。

假设您正在使用angular-ui

中的工具提示库

确保在app.js模块依赖项中引用angular-ui模块

angular.module（＆＃39; ValuesEntryApp＆＃39;，[＆＃39; ui.bootstrap＆＃39;，... more dependencies，]）。config（funciton（）{...}）; < / p>

Angular 1.3与angular-ui工具提示有一个已知问题：issue/solution

其他事项：您说即使您使用标题标记，它仍然无法呈现工具提示？我认为这取决于你使用的浏览器，但我知道至少在chrome中，如果你将鼠标悬停在一个带有标题的元素上，它会显示标题一会儿。你的glyphicon甚至在屏幕上呈现？您的控制台中是否有任何错误？如果您仍在寻求帮助，请告诉我们更多信息。如果我们有关于你设置的更多信息，我可以帮助你为它工作。

Answer 2

而不是

<span tooltip="{{product.desc}}" class="glyphicon"></span>

我们需要提供

<span data-toggle="tooltip" title="{{product.desc}}" class="glyphicon"></span>

Answer 3

以上答案均未解决我的问题。这对我有用：

代替

<span data-toggle="tooltip" title="{{product.desc}}" class="glyphicon"></span>

我们需要说：

<span data-toggle="tooltip" data-original-title="{{product.desc}}" class="glyphicon"></span>

使用AngularJS的动态工具提示

3 个答案: