Popover placement via function or 'auto' argument

[cquillen2003]

In the Bootstrap 4 docs, the popover's placement option can accept a function or an 'auto' string argument: http://v4-alpha.getbootstrap.com/components/popovers/#options

Does ng-bootstrap plan to support this?

I need this to make sure that popovers near the edge of the screen do not overflow.

[mscudlik]

i have the same issue with popovers near the edges

[cannontechnology]

I have the same issue. Is there an ETA on "auto" placement?

[anhkind]

The auto feature is working well for the cases when

• the top edge of the popover touches the top edge of the viewport
• the bottom edge of the popover touches the bottom edge of the viewport

However, we don't have the same behavior for the left and right edges of the popover. Is it a bug or something that we're already aware of?

[mscudlik]

for me auto is not usable because of the missing container functionality

[cannontechnology]

Ideally it would be nice to implement this the same as bootstrap. Specify auto and then the default position. When the default is outside the viewport it should flip to the opposite. So "auto right" would default to right and when right is outside the viewport it would shift to the left.

[pkozlowski-opensource]

@cannontechnology but we've got support for this already via [position]="[right, 'auto']". If there is anything else missing here please open a new issue - commenting on closed issues will not result in any investigations / fixes.

[alejandrocuba]

@anhkind in the meantime there is a way to deal with the left and right edges. Depending on the proximity of the popover to the viewport's lateral edge, you might want to use:

[placement]="['right', 'left', 'auto']"

OR

[placement]="['left', 'right', 'auto']"

[GIOkafor]

Popover still overflows despite
[placement]="['left', 'right', 'auto']"
Anyone else manage to get it working?

[jgaffod]

Is there any solution for this issue now?

[leye0]

The presence of this type of feature is the -only- reason I'd use bootstrap popovers over a custom solution. Yet it is not working.

[maxokorokov]

@leye0 please look at https://ng-bootstrap.github.io/#/positioning and open an issue, if something is not working for you → https://github.com/ng-bootstrap/ng-bootstrap#you-think-youve-found-a-bug