Dropdown Missing Features

Howdy,

Dropdown is missing some features from the jquery bootstrap library

• Support input/textarea in dropdown (click without closing)
• Arrow key navigation, ui-bootstrap handles this incorrectly and the page still scrolls when using arrows.
• Not close when clicking a disabled dropdown element
• Close on outside touch/tap (mobile). Current document:click is mouse only and IMO not a great option as it fires for every click for every dropdown active on your page. It also makes it more difficult to control what to auto close for as it loses track of where clicks are happening inside the dropdown vs outside.

I’ve got some of these features on my own implementation that I no longer want to maintain and would rather use this project. https://scttcper.github.io/ng2-bs-dropdown

I can make a pull request, but pretty much all of them require moving away from document:click towards another solution. I’ve placed a div with .dropdown-backdrop (like jquery bootstrap) that captures both taps and clicks when the dropdown is open, however this also catches the click and prevents clicks on lower levels from happening. So on

<button>Outside</button><div ngbDropdown [open]="true"></div>

the button won’t be clicked because the dropdown-backdrop captures the click, so button requires two clicks to activate. It could be possible to show the backdrop only when a touchstart is detected that way it’s only shown for mobile users.

Let me know your thoughts.

[marcalj]

@scttcper Please add dropdown-append-to-body to the list 😃

[pkozlowski-opensource]

@scttcper thnx for coming back to us on this one - glad to hear that things work for you. Feel free to open separated, focused issues if you feel like we could add more.

@MrCroft feel free to open a separate issue for an additional option to distinguish outside vs. internal clicks. This should be easy to add.

More generally we want to have this library shine so if you guys see any glitches or things to improve please open issues (or better yet - send PRs 😃)