feat(dropdown): Adjust position when at the edge of window

Feature description:

On Bootstrap’s page for dropdowns, when there is not enough space at the bottom of the page for the dropdown to appear, then the dropdown opens upwards. This feature is missing from Ng Bootstrap.

Link to minimally-working plunker that reproduces the issue:

Version of Angular, ng-bootstrap, and Bootstrap:

Angular: 4+

ng-bootstrap: 1.0.0-beta.5

Bootstrap: 4.0.0-beta.2

2 thoughts on “feat(dropdown): Adjust position when at the edge of window

  1. On Bootstrap’s page for dropdowns, when there is not enough space at the bottom of the page for the dropdown to appear, then the dropdown opens upwards. This feature is missing from Ng Bootstrap.

    You can specify placement constraints in ng-bootstrap to achieve the same effect.
    Ex.: <div ngbDropdown [placement]="['bottom-left', 'top-left']">
    Demo: http://plnkr.co/edit/FqcejGab8NnrqYhfqR1o?p=preview

    Closing as a support request.

  2. This shouldn’t be closed. It’s a feature request and should also handle any case of the dropdown rendering outside of the browser window.