在嵌套的ng-click中,ng-click触发两次

Question

我在尝试使用ng-click列表内部时遇到问题,该列表是另一个包含ng-click事件的列表的子列表.以下是我的代码

<ul>
  <li
    ng-repeat="facet in node.Facets"
    ng-click="updateNav(facet.Action)"
    ng-cloak
   >
    {{facet.DisplayValue}}
    <ul>
      <li ng-repeat="sub in facet.Refinements.Nodes[0].Facets"
        ng-click="updateSubNav(sub.Action)"
      >
        {{sub.DisplayValue}}
      </li>
     </ul>
  </li>
</ul>

我遇到的问题是,当我点击updateSubNav它时会自动触发updateNav.如何防止触发updateNav当我点击updateSubNav(因为我希望这两种方法独立工作？

Answer 1

防止事件传播.

视图:

<li ng-repeat="sub in facet.Refinements.Nodes[0].Facets"
    ng-click="updateSubNav($event, sub.Action)">
                           ^^^^^^        === Pass event object

控制器:

$scope.updateSubNav = function($event, action) {
    // Code here

    // Stop propagation
    $event.stopPropagation();
}