angular的事件委托

Posted 2020-07-22

事件委托：如果子元素在不断变换而且数量很多，需要不断的重复绑定事件，浪费资源。于是可以把事件绑定在父元素上，然后通过event.target找到触发该事件的事件对象。然后获取所需要的数据，执行绑定事件。

在angular中，不能直接通过event.target获取事件对象，而是必须通过传递参数 $event,然后早component中绑定的事件中加入参数获取该event对象，具体代码如下：

html中：

<div class="replyText" ng-click="deleteText($event)">
<p ng-repeat="val in discuss">
<span><b>{{val.name}}: </b></span>
<span>{{val.text}}</span>
<span class="time">{{val.time}} <a href="javascript:;" id={{val._id}}>删除</a></span>
</p>
</div>

js中：

$scope.deleteText = function($event) {
var id = $event.target.id;
console.info(id);
var bool = confirm("真的要删除吗？");
if (bool) {
$http.delete("/delete/reply/text/" + id).success(function(data) {
if (data.tips) {
getDate();
}
else{
alert("删除失败");
}
});
}
};