Angularjs - NG-点击和$ event.stopPropagation禁止Twitter的引导上下文菜单 [英] Angularjs - ng-click and $event.stopPropagation disable twitter bootstrap context menu

问题描述

所以我试图用$ event.stopPropagation，因为我有一个容器中许多不同的点击需要是独立的，我把它们使用$ event.stopPropagation以及处理，但是当涉及到​​引导，我不能由于某些原因，使其工作。上下文菜单中单击被检测为整个容器的实际NG-点击。我怎样才能让Twitter的引导上下文菜单中充当如果它有$ event.stopPropagation？

这是一个小提琴 http://jsfiddle.net/GeorgiAngelov/tJY2s/

我甚至尝试添加NG单击事件将触发HREF ='＃'，但它仍然无法正常工作。用的jsfiddle NG-点击更换HREF ='＃' http://jsfiddle.net/GeorgiAngelov/tJY2s / 1 /

 ＆LT; D​​IV NG-应用='项目'NG点击=MyClick认证（）＆GT;
    ＆LT; D​​IV NG控制器=MainControllerNG点击=MyClick认证（$事件）＆GT;
        ＆LT; D​​IV＆GT;
            ＆LT; D​​IV CLASS =头＆GT;
                dasdasdasdasd
            ＆LT; / DIV＆GT;
        ＆LT; / DIV＆GT;        ＆LT; D​​IV CLASS =下拉菜单＆GT;
            ＆LT;一类=下拉菜单，切换数据切换=下拉菜单中的href =＃＆GT;菜单＆LT; / A＆GT;
            ＆LT; UL类=下拉菜单中选择角色=菜单中的咏叹调-labelledby =dropdownMenu＆GT;
                ＆LT;立GT;＆LT;在tabIndex = -  1NG点击=＆GT;的One＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;立GT;＆LT;在tabIndex = -  1NG点击=＆GT;二＆LT; / A＆GT;＆LT; /李＆GT;
            ＆LT; / UL＆GT;
        ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
 

解决方案

引导不使用的角的机制，即适用于$ / $消化循环，来处理事件。你可能想看看的角度引导项目： http://angular-ui.github.io/bootstrap

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?

Here is a fiddle http://jsfiddle.net/GeorgiAngelov/tJY2s/

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='#' http://jsfiddle.net/GeorgiAngelov/tJY2s/1/

<div ng-app='project' ng-click="myClick()">
    <div ng-controller="MainController" ng-click="myClick($event)">
        <div>
            <div class="header" >
                dasdasdasdasd
            </div>
        </div>

        <div class="dropdown">
            <a class="dropdown-toggle" data-toggle="dropdown" href="#">Menu</a>
            <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
                <li><a tabindex="-1" ng-click="">One</a></li>
                <li><a tabindex="-1" ng-click="">Two</a></li>
            </ul>
        </div>
    </div>
</div>

解决方案

Bootstrap does not use Angular mechanism, namely $apply/$digest cycle, to handle events. You might want to check out the angular bootstrap project: http://angular-ui.github.io/bootstrap.

这篇关于Angularjs - NG-点击和$ event.stopPropagation禁止Twitter的引导上下文菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！