悬停时保持弹出框打开

Question

我设置了一个在悬停时触发NgbPopover 的元素：

<a [ngbPopover]="popContent" popoverTitle="MyPopover" triggers="mouseenter:mouseleave">Hover me</a>

目前，当元素悬停时会显示弹出框，离开区域时会连续关闭。我想要实现的是在用户将其悬停时保持弹出框打开，并且仅在用户离开元素或弹出框时将其关闭。

This SO question 可能相关，但从未得到答案。 Another related question 受到了一些关注，其中建议的解决方案（例如，this one）使用 jQuery。

Answer 1

抱歉，回答迟了，但请查看这个超级简单的解决方案，只需 2 行代码：

<div  (mouseleave)="p.close()">
<button type="button" placement="left" (mouseenter)="p.open()" #p="ngbPopover" ngbPopover="Popover Content">Click me </button></div>

Answer 2

然后只需删除鼠标离开....

  <button type="button" class="btn btn-outline-secondary" ngbPopover="You see, I show up on hover!" triggers="mouseenter" popoverTitle="Pop title">
    Hover over me!
  </button>

否则，如果您说您希望它仅在鼠标移出弹出框时关闭...这有点困难，因为它会在鼠标悬停按钮时打开。但我想你可以有某种 mouseleave 事件监听器。不过，在我看来，对于一些没有多大意义的事情来说似乎有点乏味。