我的网站上有一个下拉菜单，由ng-show。当用户单击按钮时，他们会看到下拉菜单。当他们再次单击时，下拉菜单将被隐藏：

<div class="button" ng-click="show = !show">Click Me</div>
<div ng-show="show" ng-init="show = false">
    <div>You can see me now!</div>
</div>

这很好用。但是，我想要的是show如果用户单击窗口中不是具有“button”类的 div 的任意位置，则设置为 false。我怎样才能实现这个目标？

快速/简单的方法

最快/最简单的方法是输入您的取消代码（ng-click="show=false"）在body元素，然后添加$event.stopPropagation() https://stackoverflow.com/questions/20300866/angularjs-ng-click-stoppropagation到现有的 ng-click。这样，每当您单击按钮时，由于单击事件被阻止向上传播，因此取消代码不会触发。但是，单击其他任何地方都会触发ng-click on the body，这样取消代码就会运行。这是一个小提琴 http://jsfiddle.net/abeluga/P2PP8/就是这样做的。

更多“角度”方式

我认为获得相同结果的稍微“更好”或“更有角度”的方法是创建一个新的click-off可以与 ng-click 一起使用的指令。新指令可以 (a) 注册another目标元素上的单击处理程序将停止传播，并且 (b) 在body元素来触发您需要的任何取消代码。这是该方法的小提琴 http://jsfiddle.net/abeluga/Wnx5F/.