Child ng-click not firing

Question

У меня есть вложенные элементы ul. У меня есть один и тот же ng-click для всех элементов li. По какой-то причине, если я нажимаю элемент li, который вложен под другим элементом li, запускается только родительский. В приведенном ниже примере, когда я нажимаю на элемент «Sub One» li, он дважды запускает элемент «Два» li. Я знаю, как остановить распространение, но он по-прежнему запускает родительский ng-click. Надеюсь, это имеет смысл.

<ul> 
    <li ng-click="doSomething()">One</li> 
    <li ng-click="doSomething()">Two 
     <ul> 
      <li ng-click="doSomething()">Sub One</li> 
      <li ng-click="doSomething()">Sub Two</li> 
     </ul> 
    </li> 
    <li ng-click="doSomething()">Three</li> 
</ul> 

Answer 1

Возможно, вы сделали что-то неправильно, потому что оно отлично работает. Согласно this question, просто используйте $event.stopPropagation(). Попробуйте this fiddle, например:

<ul ng-app="test" ng-controller="MyCtrl"> 
    <li ng-click="doSomething($event, 1)">One</li> 
    <li ng-click="doSomething($event, 2)">Two 
     <ul> 
      <li ng-click="doSomething($event, 21)">Sub One</li> 
      <li ng-click="doSomething($event, 22)">Sub Two</li> 
     </ul> 
    </li> 
    <li ng-click="doSomething($event, 3)">Three</li> 
</ul> 

и:

function MyCtrl($scope) { 
    $scope.doSomething = function ($event, test) 
    { 
     console.log(test); 
     $event.stopPropagation(); 
    } 
} 

Затем нажмите на "Sub One" просто показать 21 в консоли.