Question

我有以下部分模板

  <ul>
    <li ng-repeat="a in alist" ng-click="toggleShowItems(a)">
        {{a.name}}
        <ul ng-if="a.showItems" >
            <li ng-repeat="item in a.items" ng-click="showItemDetail(item.id)"> {{item.id}}
            </li>
        </ul>
    </li>
  </ul>

我遇到的问题是，当我点击嵌套列表中的某个项目时，它会崩溃。但我真正需要的是对嵌套列表项进行不同的onclick操作。请告诉我哪里弄错了。提前感谢您的回复。

Answer 1

点击内部点击即可添加$event.stopPropagation()

ng-click="showItemDetail(item.id);$event.stopPropagation()"

Answer 2

正在发生的事情是，点击正在向dom树冒泡。这可以通过将$ event对象作为参数传递给click并在click处理程序中调用stopPropagation来停止：

查看：

ng-click="showItemDetail(item.id, $event)"

控制器：

$scope.showItemDetail = function(id, $event){
    // do your stuff
    $event.stopPropagation();
};

父级列表项onclick正在接管子列表项的onclick（AngularJS）

2 个答案: