博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
angularjs之事件绑定、解除事件绑定
阅读量:5008 次
发布时间:2019-06-12

本文共 953 字,大约阅读时间需要 3 分钟。

今天在开发时,遇到一个坑,花了一下午时间也没找到原因,无奈小菜鸟只能寻求公司里大牛的帮助,果然,大牛就是大牛,对比了几个输出结果,就看出问题所在。所以小菜鸟当然不会错过这个分享的时机啦~废话不多说进入正题:

在angular开发时,会把整体分解成各个功能块,然后使用自定义指令directive或者service或者factory,总之想尽办法再给组合在一起,所以问题来了~

比如:往一个页面添加元素(按钮?等等),此时点击添加的按钮在directive1里,而元素的添加又在directive2里,所以要怎么通讯呢,我选择了事件的方式:

directive1  有代码如下:

$scope.insertWidget = function(type){

  $rootScope.$emit("widget.insert",type);
};

directive2 有代码如下:

$rootScope.$on("widget.insert",function($event,type){

  //功能代码
});

当然这是有问题的。

当directive2里的scope被destroy的时候,它绑定的事件并没有解除,因为绑定在$rootScope下了,所以当我再次操作时,事件会累加,导致再次刷新该页面的时候,widget.insert事件累积了两次,(以此累积)。

在我今天要完成的功能里就造成了影响,因为我是每添加一个元素会有$modal.open的操作,所以这样我去关闭这个modal会累积关闭几个,如果不解除的话。

所以解决方法是:

  $on事件会返回一个函数,只要在当前scope被destroy时,执行这个函数就好了~见代码:

    var destroyInsert = $rootScope.$on("widget.insert",function($event,type){

      //功能代码
    });

    $scope.$on("$destroy",function(){

      destroyInsert();
    });

今天遇到的这个坑就解决啦~

转载于:https://www.cnblogs.com/sheting/p/5071096.html

你可能感兴趣的文章
simple java mail
查看>>
信息建模
查看>>
二进制中1的个数
查看>>
Android ListView 滚动时背景变黑色
查看>>
《机器学习》第一章 引言 笔记加总结
查看>>
每天一点点之vue框架开发 - 引入bootstrap
查看>>
【刷题】洛谷 P3806【模板】点分治1
查看>>
mysql 二进制文件增量备份
查看>>
使用ffmpeg步骤
查看>>
RabbitMQ inequivalent arg 'durable' for exchange 'csExchange' in vhost '/': received
查看>>
《2017中国云计算评测报告》
查看>>
有木有兄弟在研究HTML5和css3啊?进来唠叨一下,分享一下你的资源
查看>>
Hibernate 中一对多和多对多映射
查看>>
EL表达式_详解
查看>>
Mybatis 数据库物理分页插件 PageHelper
查看>>
虚函数、纯虚函数详解
查看>>
z-stack中数据的发送,广播、组播、点对点
查看>>
Practial Vim 学习笔记一
查看>>
.NET中使用js实现百度搜索下拉提示效果[不是局部刷新,呜呜。。]
查看>>
ITCAST视频-Spring学习笔记(使用Spring的注解方式实现AOP入门)
查看>>