Keep popover open when hovering it

Question

I have set up an element that triggers a NgbPopover on hover:

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

Currently, the popover will be shown when hovering the element and consecutively dismissed when leaving the area. What I'd like to achieve is to keep the popover open when the user hovers it, and only dismiss it when the user moves away from the element or the popover.

This SO question may be related, but never got an answer. Another related question that received some attention, where the proposed solutions (e.g., this one) make use jQuery.

Answer 1

Sorry for the late answer but check out this super easy solution with 2 lines of code:

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