ng-class $event.stopPropagation(） 在 Angular 中对父级不起作用

ng-class $event.stopPropagation() not working on parent in angular

本文关键字：不起作用 Angular event stopPropagation ng-class      更新时间：2023-09-26

我有 2 个嵌套ng-repeats。父级根据ng-click为自己添加一个类，但是当我单击子级时，它仍然在我认为不应该发生的时候发生。

<div class="add-filter-tags" data-filter="{{f1}}" ng-class="{'tag_selected' : tag_selected }" ng-repeat="(f1,f2) in filters" ng-click="tag_selected = !tag_selected;">
            <span>{{f1}}</span>             
        <div class="add-filter-tags sub-filter-tag"  data-filter="{{f1_2}}"  ng-click="$parent.$event.stopPropagation()" ng-repeat="(f1_2,f2_2) in filters[f1]" sibs ><span>{{f1_2}}</span></div>
</div>

编辑：我也在没有$parent的情况下尝试过它，它不起作用。

您应该停止子级上的事件传播，以便它不会冒泡到父级，也不会有$event对象附加到$parent。这是一个与ng-click传递的特殊参数，即

 ng-click="$event.stopPropagation()"


angular.module('app', []).controller('ctrl', function($scope) {
});
.tag_selected {
  color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
  <div class="add-filter-tags" ng-class="{'tag_selected' : tag_selected }" ng-if="true" ng-click="tag_selected = !tag_selected;">
    <span>Parent</span> 
    <div class="add-filter-tags sub-filter-tag" ng-click="$event.stopPropagation()" ng-if="true"><span>Child</span>
    </div>
  </div>
</div>

相关文章：