mouseenter（Angularjs）上的弹出延迟显示

Question

我创建了 Angularjs 指令，将触发器连接到弹出框。一切正常，除非我想在弹出窗口中添加延迟显示。我是 javascript 和 angular js 的新手。因此，我们将不胜感激。

.directive('businessCardPopup', function() {
    return {
        restrict: "A",
        link: function(scope, pop, attrs){
            scope.label = attrs.popoverLabel;

            $(pop).popover({
                trigger: "manual" ,
                container: 'body',
                template: '<div class="popover" role="tooltip" style="width: 400px;">' +
                '<div class="arrow"></div>' +
                '<h3 class="popover-title"></h3>' +
                '<div class="popover-content">' +
                '<div class="data-content"></div>' +
                '</div></div>',
                html: true,
                animation:false,
                content: '<div class="col-lg-4"></div>' +
                '<div class="col-lg-8"><p>Name</p>' +
                '<p>Position</p>' +
                '<p>Telephone</p>' +
                '<p>Email</p>' +
                '<p>Skype | Twitter | LinkedIn</p>' +
                '<p>Conversation | View Profile | Follow</p></div> ',
                placement: 'top',
                delay: {"show": 2000}
            })
                .on("mouseenter", function () {
                    var _this = this;
                    $(this).popover("show");
                    $(".popover").on("mouseleave", function () {
                        $(_this).popover('hide');
                    });
                }).on("mouseleave", function () {
                    var _this = this;
                    setTimeout(function () {
                        if (!$(".popover:hover").length) {
                            $(_this).popover("hide");
                        }

                    }, 500);
                })


        }
    }
}

)

Answer 1

我认为应该是show: "600" 而不是"show": 600

Answer 2

您的触发器类型是manual，而delay 不适用于手动触发器类型。

查看文档：http://getbootstrap.com/javascript/#popovers-usage

你可以试试trigger: 'focus'。