Question

我需要显示具有以下条件的uib工具提示：

在平板电脑和智能手机等触摸设备上，当用户触摸信息图标时，应显示工具提示。
在桌面等上，当用户将指针悬停在信息图标上时，应显示工具提示。

以下是我的工具提示指令

.directive('infoTooltip', function ($compile) {
    return {
        scope: {
            tooltip: '@'
        },
        link: function (scope, elem, attrs) {
            scope.message = scope.tooltip;
            var el = angular.element('<span class="tooltip-common"><i class="fa fa-info-circle" uib-popover={{message}} popover-trigger="mouseenter" popover-placement="top" popover-animation="true"></i></span>');
            $compile(el)(scope);
            elem.after(el);
        }
    };
}); /*
    Usage : <ANY info-tooltip data-tooltip="tooltip message">
*/

任何人都可以帮我修改这个指令来实现这个目的。提前谢谢。

Answer 1

自己找到它，只需要向popover-trigger添加更多事件，如下所示：

popover-trigger="mouseenter outsideClick"

“outsideClick”触发器将使弹出窗口在点击时切换，并在点击任何其他内容时隐藏。（来自docs）

桌面和触摸设备上的Angular UIB工具提示，

1 个答案: