几秒后,角度引导弹出隐藏
这是我的HTML代码:
单击该图标时,将按预期打开弹出窗口。 只需单击图标即可关闭弹出窗口。 我希望在几秒钟后自动关闭popover。
这是我的javascript代码 – 不起作用:
$('.pop').popover().click(function () { setTimeout(function () { $('.pop').popover('hide'); }, 4000); });
跑步的时候
$('.pop').popover()
在FF调试器上我得到:
typeError: undefined is not a function
请帮忙 :)
受@ dfsq关于tt_isOpen的想法的 tt_isOpen
,你可以创建一个自定义指令来进行自动隐藏。
.directive('popoverAutoclose', function ($timeout) { return { restrict: 'A', link: function (scope, element, attrs) { var timeoutHandle; scope.$watch('tt_isOpen', function (isOpen) { $timeout.cancel(timeoutHandle); if (isOpen) { timeoutHandle = $timeout(function () { scope.tt_isOpen = false; }, +attrs.popoverAutoclose || 5000); } }); } } });
并像这样使用它:
示例Plunker: http ://plnkr.co/edit/KQKHtz73lFk8Z4g4q6a4?p = preview
你能想到的唯一方法我觉得有点奇怪,但是工作。 将ngMousedown
处理程序添加到LI
元素并在控制器中为其定义处理程序:
Link
控制器:
$scope.mousedown = function() { var tooltipScope = this; $timeout(function() { tooltipScope.tt_isOpen = false; }, 2000); };
想法是AngularUI的popover在内部使用$tooltip
服务,它在元素的范围内定义了一堆内部属性。 其中一个属性是tt_isOpen
。 如果将其设置为false
工具提示将隐藏。
演示: http : //plnkr.co/edit/T1Uouba0MU2vtcwuRPt9?p =preview
最简单的方法是创建一个布尔变量,并给它一个True / False值,如果你点击弹出窗口,将调用一个方法抛出控制器,并将是一个超时,将变量翻转为a假。 该变量将在标签“ng-show”中用于显示和隐藏。
最好的祝福