Question

我正在努力添加一个下拉菜单，但我想修复一个错误。目前，当我点击图标时，下拉菜单将起作用。但是，当点击网站上的其他按钮或其他区域时，下拉保持打开状态。我希望它关闭......这个项目中有很多代码，所以我已经采取了创建错误的部分。有什么建议吗？

HTML：

<div class="fa fa-ellipsis-v action-icon" ng-class="{'selected': menuActions}" ng-click="dropDownMenu()"></div>

JavaScript的：

// This function handles the ellipsis
            $scope.dropDownMenu = function () {
                  $scope.myShareFeature = false;
                  $scope.mySignatureFeature = false;
                  $scope.menuActions = !$scope.menuActions;

Answer 1

在这里看看这个答案：

Click everywhere but here event

他创建了自己的指令 - 然后在控制器上使用它：

app.directive('clickAnywhereButHere', function($document){
  return {
    restrict: 'A',
    link: function(scope, elem, attr, ctrl) {
      elem.bind('click', function(e) {
        // this part keeps it from firing the click on the document.
        e.stopPropagation();
      });
      $document.bind('click', function() {
        // magic here.
        scope.$apply(attr.clickAnywhereButHere);
      })
    }
  }
})

<强> HTML

<div class="fa fa-ellipsis-v action-icon" ng-class="{'selected': menuActions}" ng-click="dropDownMenu()" click-anywhere-but-here="dropDownMenu()"></div>

Answer 2

可能你必须使用顶级＆＃39;点击＆＃39;事件监听器，关闭菜单。此外，你应该停止点击＆＃39;菜单内的事件传播。但是，如果您使用某些现有的库或其他内容，那将会更好。

ng-click无法正常工作

2 个答案: