The [bsPopover] structural directive on an <ng-template> attaches a rich popover (title + body) to its host element. The directive input takes a placement — 'top', 'bottom', 'start', or 'end' — and [updatePosition]="true" keeps the popover anchored as the host moves or scrolls. The header and body are tagged with bsPopoverHeader and bsPopoverBody. The demo below shows all four positions.
Just to demonstrate that nothing is being cut-off, we're having position:relative;overflow:hidden on the containers.