Question

嘿我正在使用ng-click指令绑定menu上的menuIconClick（$ event）函数。但是也绑定到子li。代码如下：

%div.sideNavBar
  %ul.navBar
    %li.icons-briefcase-static{'ng-click'=>"menuIconClick($event)"} // binding here only
      %ul.subMenu
        %li All sites // but gets call here also
        %li{'ng-repeat'=>"site in sites"}
          {{site.name}}
    %li.icons-users-disabled
  %div.lock.icons-lock-disabled

模板位于HAML中。我没有原因？

任何帮助表示赞赏

Answer 1

尝试放置图标＆amp;图标单击事件作为单独的元素，而不是父元素。 DOM事件在层次结构中冒泡，因此如果父元素具有ng-click处理程序，则单击任何子元素也将触发该父单击处理程序，除非您停止事件传播。

您可以停止事件传播，类似于：

AngularJS ng-click stopPropagation

或更改您的DOM结构，以使公文包图标不是子菜单的父级：

%div.sideNavBar
  %ul.navBar
    %li
      %a.icons-briefcase-static{'ng-click'=>"menuIconClick($event)"} // no longer a parent
      %ul.subMenu
        %li All sites // click here won't bubble up to ng-click
        %li{'ng-repeat'=>"site in sites"}
          {{site.name}}
    %li.icons-users-disabled
  %div.lock.icons-lock-disabled

Answer 2

试试他的。 e.stopPropagation()我不确定这一点。

%li.icons-briefcase-static{'ng-click'=>"menuIconClick($event);$event.stopPropagation();"}

Answer 3

试试这个：

In html list,

纳克单击=＆＃34; menuIconClick（$事件）＆＃34;

 In JS function,

$ scope.menuIconClick = function（ev）{

ev.stopPropagation();

}

ng-click事件以角度js绑定到子li

3 个答案: