我正在使用ServiceNow的Istanbul版本,并且遇到一些将bootstrap popover合并到我的小部件中的问题。该小部件当前具有fullCalendar依赖性,并呈现带有重要日期的日历。我想合并一个弹出窗口,用户可以单击它来获取更多信息,但是它似乎无法正常工作。我已经使用以下jquery初始化了popover:
<script>
$(document).ready(function(){
$('[data-toggle="popover"]').popover();
$('.popover-dismiss').popover({
trigger: 'focus'
})
});
</script>
我的HTML看起来像这样:
<span class="list-group-item" ng-repeat="item in c.dates | orderBy:'date' track by $index" ng-if="item.displayList=='true' && item.futureDate">
<li class="rowflex" style="list-style: none;">
<div class="colflex">
<strong><i class="fa fa-calendar" aria-hidden="true"></i> {{item.date}}</strong>
<p>{{item.date_name}}</p>
</div>
<a tabindex="0" class="glyphicon glyphicon-question-sign" role="button" data-toggle="popover" data-placement="right" data-trigger="focus" title="test" data-content="test"/>
</li>
</span>
当前,当我将鼠标悬停在问号字形上时,我可以看到“测试”,但是当我单击它时,什么也没有发生。
当我在控制台中查看时,会收到此错误消息,但我不熟悉如何解决它:
有什么建议么?
谢谢!
最佳答案
经过多次尝试使其有效后,我找到了解决方案。您需要使用超时。
在窗口小部件中使用以下选项之一。
选项1-客户端脚本(客户端控制器)
function ($scope, spUtil, $sce, $rootScope, $timeout) {
$(document).ready(function(){
setTimeout(function(){
$('[data-toggle="popover"]').popover();
},500);
});
}
选项2-链接功能
function() {
$(document).ready(function(){
setTimeout(function(){
$('[data-toggle="popover"]').popover();
},500);
});
}
样品:
Popover sample
关于jquery - 引导弹出窗口在ServiceNow小部件中不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45576404/