Avoid having to double-click to toggle Bootstrap dropdown
If someone is using angular with ui-bootstrap module along with normal bootstrap HTML dropdown definition, there are also two clicks needed.
<li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a> [...]</li>=> Removing the data-toggle="dropdown" will fix the issue.
Opening the dropdown with one click will work after this.
Reference:https://github.com/angular-ui/bootstrap/issues/2294
In Bootstrap 4, bootstrap.min.js and bootstrap.bundle.min.js now conflict in dropdown.
By removing bootstrap.min.js, the dropdown double click issue will resolved.
This may happen if somehow Bootstrap is included twice in your project.
If bootstrap.min.js and bootstrap.bundle.min.js(bootstrap and popper js) both included in project, it means redundant bootstrap js.
The js combination should be like this:Either : bootstrap.bundle.min.js onlyOr : bootstrap.min.js AND popper.min.jsFor detailed information, visit https://getbootstrap.com/docs/4.1/getting-started/contents/