当工具提示到达 ng-bootstrap 中的 y-axis 上的特定点时，是否可以更改工具提示的位置？

Question

我的问题是我的工具提示显示在 header nav-bar 下，但我希望它在工具提示框点击时翻转到另一个位置（例如：'left-bottom'） header.

是否可以在ng-bootstrap中手动设置工具提示的边界？ Vanilla Bootstrap api 有边界选项，我认为这是为了限制工具提示的显示位置，但是 ng-bootstrap api 没有这个选项。

我的代码如下所示：

<div triggers="{{ triggers }}" placement="{{ placement }}" ngbTooltip="{{ content }}"></div>

我正在考虑看起来像这样的实现，但我愿意接受建议：

<div triggers="{{ triggers }}" placement="{{ placement }}" ngbTooltip="{{ content }}" boundary="{{ top: 60px }}"></div>

我的项目有这些版本：

ng-bootstrap 版本 8.0.0

Angular 版本 10.0.5

Answer 1

我找到了解决办法！它是使用自定义指令。

我根据自己的需要编辑了这个自定义指令，它起作用了。

来源：Custom tooltip directive

Is it possible to change placement of the tooltip when it hits a certain point on the y-axis in ng-bootstrap?