title: Angularjs - ng-click and $event.stopPropagation disable twitter bootstrap context menu
body: <p>Hey guys so I am trying to use $event.stopPropagation because I have many different clicks in one container that need to be independent and I handle them using $event.stopPropagation as well, but when it comes to bootstrap, I cannot for some reason make it work . The context menu  click is detected as actual ng-click on the whole container. How can I make the twitter bootstrap context menu act as if it had $event.stopPropagation?</p>
  
  <h2>Here is a fiddle <a href="http://jsfiddle.net/GeorgiAngelov/tJY2s/" rel="nofollow">http://jsfiddle.net/GeorgiAngelov/tJY2s/</a></h2>
  
  <h2>I even tried adding an ng-click event that will trigger the href='#' but it still does not work. jsFiddle with ng-click to replace the href='#'  <a href="http://jsfiddle.net/GeorgiAngelov/tJY2s/1/" rel="nofollow">http://jsfiddle.net/GeorgiAngelov/tJY2s/1/</a></h2>
  
  <pre><code>&lt;div ng-app='project' ng-click="myClick()"&gt;
      &lt;div ng-controller="MainController" ng-click="myClick($event)"&gt;
          &lt;div&gt;
              &lt;div class="header" &gt;
                  dasdasdasdasd
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="dropdown"&gt;
              &lt;a class="dropdown-toggle" data-toggle="dropdown" href="#"&gt;Menu&lt;/a&gt;
              &lt;ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu"&gt;
                  &lt;li&gt;&lt;a tabindex="-1" ng-click=""&gt;One&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a tabindex="-1" ng-click=""&gt;Two&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>