Question

问候所有人:)

我的问题与bootstrap工具提示有关。我的页面中有一堆工具提示（确切地说是5个）。

工具提示看起来（或多或少）像这样：

<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="top" title="{{'calculation.ttSD' | translate}}"></span>

我使用经典值

在页面的最顶部（紧随其后）初始化它们

<script>
$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip();
});
</script>

大多数工具提示都是在没有任何问题的情况下初始化的，但是2个工具提示无法正常工作页面的某些部分在页面加载和显示时隐藏，具体取决于用户输入的内容。

示例：

<tr ng-if="condition == 'true'">
<label data-translate="the.text.to.put.in.the.label"/>
<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="top" tittle="someText">

...

这些工具提示在开始时未正确初始化。作为一个快速修复，我只是复制了上面的javascript并将其放在工具提示之后，这是有效的。除了杀死DRY原则，因为相同的精确js在页面内出现3-4次。

有什么更好的方法（如果有办法）初始化所有引导程序工具提示，无论是否隐藏？

谢谢:)

Answer 1

ng-if阻止呈现DOM元素。因此，document.ready中的初始化不会对您的ng-if虚假元素

生效

相反，您可以使用ng-show/ ng-hide，因为它们只会更改显示css-poperty

将您的示例修改为ng-show而不是ng-if

<tr ng-show="condition == 'true'">
<label data-translate="the.text.to.put.in.the.label"/>
<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="top" tittle="someText">

希望有所帮助

初始化＆＃34;隐藏＆＃34;页面加载时的工具提示

1 个答案: