角度引导弹出框在几秒钟后隐藏

Question

这是我的 html 代码：

<li class="pop" popover="popover text goes here" popover-trigger="mousedown">
    <a><i class="icon-link"></i></a>
</li>

单击该图标时，将按预期打开弹出窗口。目前，只能通过单击图标来关闭弹出窗口。我希望弹出窗口会在几秒钟后自动关闭。

这是我的 javascript 代码 - 不起作用：

$('.pop').popover().click(function () {
   setTimeout(function () {
     $('.pop').popover('hide');
   }, 4000);
}); 

跑步时

$('.pop').popover()  

在 FF 调试器上我得到：

typeError: undefined is not a function

请帮忙 ：）

Answer 1

受到@dfsq关于的想法的启发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);
        }
      });
    }
  }
});

并像这样使用它：

<li class="pop" popover="popover text goes here" popover-autoclose="2000" popover-trigger="mousedown">

示例 Plunker： http://plnkr.co/edit/KQKHtz73lFk8Z4g4q6a4 ?p=preview