ng-单击“工作不正常”

ng-click Not working Correctly

本文关键字:工作不正常 不正常 工作 单击 ng-      更新时间:2023-09-26

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

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;

看这里的答案:

点击除这里以外的所有地方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);
      })
    }
  }
})

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

可能,您必须使用顶级'click'事件侦听器来关闭菜单。此外,你应该停止菜单内的"点击"事件传播。但是,如果您使用现有的库或其他东西,则会更好。