How to prevent an angular-bootstrap dropdown from closing (Unbind Event which was bound by a directive)

Question

I am using the Angular-Bootstrap Dropdown. I want to prevent it from closing on click until the user closes it intentionally.

Default state is: The Dropdown closes when clicking somewhere in the Document.

I identified the relevant lines of code: (Line 12, dropdown.js)

this.open = function( dropdownScope ) {    if ( !openScope ) {      $document.bind('click', closeDropdown); // line to unbind      $document.bind('keydown', escapeKeyBind);    } } 

You can find the full code here: Link to Github

I don't want to change the original sources of angular-bootstrap to keep my project open for updates.

My question:

How can i unbind an event bound by a Directive to the document in an Angular Controller?

Answer 1

I solved this by adding the following to my drop down-menu. This prevents the drop down from closing unless you click on the tag that opens it

<ul class="dropdown-menu" ng-click="$event.stopPropagation()">