[Bug] - Nested popover - autoclose="outside" not working

[Shyamal Parikh]

Bug description:

If there are nested popovers and if you click on a nested popover it closes all popovers.

• For all popovers the following configuration applies [autoClose]="'outside'" and [container]="'body'"

Note: It works fine if the nested popover is not appended to the body.

Link to minimally-working StackBlitz that reproduces the issue: Link

Versions of Angular, ng-bootstrap and Bootstrap:

Angular: 17.x

ng-bootstrap: 16.x

Bootstrap: 5.x

[IAfanasov]

The issue is that the second popup is outside of the first popup, so click inside the second popup triggers close of the first popup.
To solve it we should change the code so that the first popup do not close on the click of the second popup. An easy solution is not on the surface here. The reliable way will be to track the parent child relationships between popups.

[Shyamal Parikh]

Yes, it would be great if the framework provides an inbuilt way to achieve this.

Alternatively, we can handle this ourselves in a hacky way if the following is addressed - #4680