Javascript 在表中悬停几下后,引导popover停止
我有一个具有动态行数的表。我想有一个流行音乐出现在悬停在每行的某个元素。然而,当我加载页面时,popover在最初的几次(3-6次?)中工作,然后popover完全消失Javascript 在表中悬停几下后,引导popover停止,javascript,jquery,twitter-bootstrap,html-table,popover,Javascript,Jquery,Twitter Bootstrap,Html Table,Popover,我有一个具有动态行数的表。我想有一个流行音乐出现在悬停在每行的某个元素。然而,当我加载页面时,popover在最初的几次(3-6次?)中工作,然后popover完全消失 <div class="container"> <table class="table" style="width:20%"> <tr ng-repeat="game in games.mlb">
<div class="container">
<table class="table" style="width:20%">
<tr ng-repeat="game in games.mlb">
<td>
{{ game.awayTeam }} <br> {{ game.homeTeam }}
</td>
<td>
{{ game.awayScore }} <br> {{ game.homeScore }}
</td>
<td>
<span data-toggle="popover"
data-trigger="hover"
data-content="Some content"
style="float: right"> {{ game.status}} </span>
</td>
</tr>
</table>
</div>
{{game.awayTeam}
{{game.homeTeam}
{{game.awayScore}}
{{game.homeScore}}
{{game.status}
这是表的代码。如您所见,我正在尝试将鼠标悬停时的弹出框应用于表中每行第三列中的动态文本。当我加载页面时,它会工作一段时间。直到它只是。。。没有
以下是jquery:
<script>
$(document).ready(function () {
$('[data-toggle="popover"]').popover();
});
</script>
$(文档).ready(函数(){
$('[data toggle=“popover”]')。popover();
});
ng repeat
与$(文档).ready
不兼容,因为无法保证$(文档).ready
调用将在整个ng repeat
加载之前进行
这实际上把问题从引导式问题变成了一个角度问题(可以通过使用ng repeat
)来确定。由于在ng repeat
循环的末尾没有回调,因此可以使用指令
这将是表格行的HTML:
<tr ng-repeat="game in games.mlb" my-repeat-directive>
<!-- things go here -->
</tr>
是否在
$('[data toggle=“popover”]')之后加载表行。popover()代码>呼叫?即使您使用的是$(document).ready
,如果在调用后加载行,它们也不会有工具提示。另外,请注意,这里有一个输入错误:我创建了一个没有角度和固定值的静态表,您在诊断问题方面似乎是正确的。popover在equation.Update中没有角度。我抛弃了JQuery,转而使用全角度。我使用了Angular UI Bootstrap()中列出的弹出窗口,而不是制定自己的指令。现在效果很好。你在这个问题上给了我线索。谢谢
angular.module('myApp', [])
.directive('myRepeatDirective', function() {
return function(scope, element, attrs) {
// set your popovers per row element
};
})