Инициализации «скрытая» подсказка на загрузке страницы

Question

Привета всем :)

Мой вопроса относится к бутстраповским подсказкам. У меня есть куча подсказок на моей странице (точнее, 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-недвижимости и имущества

Изменив пример 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"> 

надеюсь, что это помогает