Ngx-bootstrap: feat(popover): add more positional options for popover (for example, ‘bottom-left’)

[ameionline]

The show is current version placement of popver

how to make placement of popover to set as ‘bottom-left’? Below:

[gastonelhordoy]

Hey there, I agree with @ameionline, it would be great if we could have the same positional options as in ui-bootstrap:

• top - popover on top, horizontally centered on host element.
• top-left - popover on top, left edge aligned with host element left edge.
• top-right - popover on top, right edge aligned with host element right edge.
• bottom - popover on bottom, horizontally centered on host element.
• bottom-left - popover on bottom, left edge aligned with host element left edge.
• bottom-right - popover on bottom, right edge aligned with host element right edge.
• left - popover on left, vertically centered on host element.
• left-top - popover on left, top edge aligned with host element top edge.
• left-bottom - popover on left, bottom edge aligned with host element bottom edge.
• right - popover on right, vertically centered on host element.
• right-top - popover on right, top edge aligned with host element top edge.
• right-bottom - popover on right, bottom edge aligned with host element bottom edge.

Great work BTW!
Thanks!

[Anima-t3d]

For now I am using ng2-pop-over You do need to create your own styling though.

[michaelfaisst]

@gastonelhordoy Forked the repo to implement this, but then I noticed that there is the posibility to give two values to the placement input (e.g. "bottom left", "left top" etc.). It seems to work for me at least, but position of the popover arrow is not calculated accordingly. Don't know if it is a feature in development due to no documentation at all, but for a quick fix it works.

[qwe852147]

Sorry, this feature will be implement in future?

[kondareddyyaramala]

Hey Hi @michaelfaisst, I tried with bottom left , but it doesn't seem to be working. Is there anything needs to be done for this to work other than changing the placement property? Do you have any plukr made for this use case ?

[jziggas]

This would be a great addition for people looking to move away from ui-bootstrap while going through the upgrade process on components. Without feature parity there's a lot of heartburn in making the move.