Question

我试图根据屏幕分辨率更改工具提示的位置（基于AngularJS Bootstrap UI），基本上是第一个在移动设备上，第二个在其余部分（最小宽度≥ 768px）：

tooltip-placement="top"


tooltip-placement="left"

我已经找到了使用jQuery（下一段代码）的解决方案，但我不知道如何在Angular中实现它。

$(window).on('resize', function() {
  var pos = ($(window).width() < 768) ? 'left' : 'top';
  $("#myDiv").tooltip({'placement': pos});
}).trigger('resize');

任何提示？

Answer 1

您可以在范围中定义一个功能，以确定工具提示的位置。例如：

$scope.getTooltipPlacement = function () {
    return ($(window).width() < 768) ? 'left' : 'top';
};

然后在您想要工具提示的元素上，您可以在tooltip-placement属性中调用此函数：

<a href="#" tooltip="My awesome tooltip" tooltip-placement="{{getTooltipPlacement()}}">Link</a>

使用AngularJS UI制作相对于窗口大小的工具提示位置

1 个答案: