Question

angular 获取 ng-click 所在元素对象的问题

页面结构是这样的
<div ng-click="fun($event.target)" data-str="abc">
<span>...</span><span>...</span><span>...</span>
</div>
ng-click写在外面的父元素上，我想拿到"data-str"这个属性值，但点击只能点到子元素上，我用$event.target只能拿到子元素span对象，有什么方法解决吗？谢谢了。

Answer 1

首先，确实是可以通过$event.target参数来拿对象的，拿到的对象可像操作jquery元素一样操作，所以子集、父级、同级都可以随意转换。

但是，并不推荐这种做法，angular存在的目的就是避免对dom元素的直接操作，你的这个需求，推荐考虑一下办法实现：

1. data-str里面的东西写到ngClick参数中，如<div ng-click="fun('abc')">，这样fun()直接获取到abc参数，简单明了，可读性和可维护性也更强；

2. 封装一个directive，通过link(scope, element, attrs)获取data-str参数，同时亦可以对dom直接进行操作，可定制性更强，适合高级需求，但至少我从题主的例子里面看不出。
   

Answer 2

只需要在函数参数中传入$event参数，在函数中使用$event.target就可以获取到了。

具体方法：

[javascript] view plain copy

<input class="unchecked" type="checkbox" ng-model="item.isCustOmized" ng-click="switchCheckBox($event, item.isCustOmized)" />  

[javascript] view plain copy

$scope.switchCheckBox = function($event, value) {  

// console.log(value)  

if (value) {  

$($event.target).addClass("checked");  

} else {  

$($event.target).removeClass("checked");  

}  

}  

Answer 3

$event.target.parent

Answer 4

$event.currentTarget能解决