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

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 工具提示，

Angular UIB tooltip on desktop and touch devices,

angularjs

angular-ui-bootstrap