几秒后,角度引导弹出隐藏

这是我的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”中用于显示和隐藏。

    最好的祝福