AngualrJs清除定时器遇到的坑


Posted in Javascript onOctober 13, 2017

angualrJs清除定时器爬坑之路:

今天发现一个奇怪问题,放在自定义指令里边的定时器竟然在页面跳转之后,在另一个页面这个循环定时器还在执行,这肯定是不行的,会影响系统的性能。

我在angular里边用原生的方法window.onunload方法竟然不管用,所以只好用angular自己的方法$destroy,这页面跳转,DOM结构发生变化是都能清除定时器

var timer = setInterval(function(){
          $scope.$apply(function(){
            //这里是想要定时刷新的逻辑
          });
        },3000);
        $scope.$on('$destroy',function(){
          if (timer) {
            clearInterval(timer);
            timer = null;
          }
        });

 这里说一下,因为我用的是javascript中原生的setTimeout()以及setInterval()函数,所以清除时对应是clearTimeout()clearInterval(),angular定时器是$timeOut$interval,所以清除对应是$timeOut.cancel()$interval.cancel(),

必须一一对应,不一致是不会清除掉的。

总结

以上所述是小编给大家介绍的AngualrJs清除定时器遇到的坑,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
自动更新作用
Oct 08 Javascript
CutePsWheel javascript libary 控制输入文本框为可使用滚轮控制的js库
Feb 07 Javascript
js中使用DOM复制(克隆)指定节点名数据到新的XML文件中的代码
Jul 27 Javascript
jquery ajax例子返回值详解
Sep 11 Javascript
Javascript中call与apply的学习笔记
Sep 22 Javascript
js关于命名空间的函数实例
Feb 05 Javascript
基于Vue如何封装分页组件
Dec 16 Javascript
Vue异步组件使用详解
Apr 08 Javascript
详解AngularJS脏检查机制及$timeout的妙用
Jun 19 Javascript
bootstrap插件treeview实现全选父节点下所有子节点和反选功能
Jul 21 Javascript
vue项目中使用eslint+prettier规范与检查代码的方法
Jan 16 Javascript
Vue.Draggable实现交换位置
Apr 07 Vue.js
React Native中Navigator的使用方法示例
Oct 13 #Javascript
React Native中TabBarIOS的简单使用方法示例
Oct 13 #Javascript
ReactJS实现表单的单选多选和反选的示例
Oct 13 #Javascript
Angular.js通过自定义指令directive实现滑块滑动效果
Oct 13 #Javascript
捕获未处理的Promise错误方法
Oct 13 #Javascript
解决ie img标签内存泄漏的问题
Oct 13 #Javascript
jq源码解析之绑在$,jQuery上面的方法(实例讲解)
Oct 13 #jQuery
You might like
第五章 php数组操作
2011/12/30 PHP
解析php中反射的应用
2013/06/18 PHP
Zend Framework实现具有基本功能的留言本(附demo源码下载)
2016/03/22 PHP
PHP根据树的前序遍历和中序遍历构造树并输出后序遍历的方法
2017/11/10 PHP
PHP PDOStatement::getAttribute讲解
2019/02/01 PHP
javascript中数组方法汇总
2015/07/07 Javascript
PHP+jQuery+Ajax+Mysql如何实现发表心情功能
2015/08/06 Javascript
基于jQuery实现交互体验社会化分享代码附源码下载
2016/01/04 Javascript
10分钟掌握XML、JSON及其解析
2020/12/06 Javascript
JavaScript获取中英文混合字符串长度的方法示例
2017/02/04 Javascript
微信小程序页面开发注意事项整理
2017/05/18 Javascript
MvcPager分页控件 适用于Bootstrap
2017/06/03 Javascript
JS实现多张图片预览同步上传功能
2017/06/23 Javascript
浅析JS中常用类型转换及运算符表达式
2017/07/23 Javascript
js学习总结之DOM2兼容处理重复问题的解决方法
2017/07/27 Javascript
Vue2.0 vue-source jsonp 跨域请求
2017/08/04 Javascript
原生js中ajax访问的实例详解
2017/09/19 Javascript
jQuery实现的电子时钟效果完整示例
2018/04/28 jQuery
Vue.js 图标选择组件实践详解
2018/12/03 Javascript
Jquery的autocomplete插件用法及参数讲解
2019/03/12 jQuery
[01:37]TI4西雅图DOTA2前线报道 VG拿下首胜教练357给出获胜秘诀
2014/07/10 DOTA
pytorch构建网络模型的4种方法
2018/04/13 Python
基于Python列表解析(列表推导式)
2018/06/23 Python
对python数据切割归并算法的实例讲解
2018/12/12 Python
python实现批量视频分帧、保存视频帧
2019/05/31 Python
Django对数据库进行添加与更新的例子
2019/07/12 Python
Python面向对象之Web静态服务器
2019/09/03 Python
提供世界各地便宜的机票:Sky-tours
2016/07/21 全球购物
JBL美国官方商店:扬声器、耳机等
2019/12/01 全球购物
农药学硕士毕业生自荐信
2013/09/25 职场文书
大学班级学风建设方案
2014/05/01 职场文书
党员评议自我评价
2015/03/03 职场文书
幼儿园中班班级总结
2015/08/10 职场文书
2016党员干部廉洁自律心得体会
2016/01/13 职场文书
CSS预处理框架——Stylus
2021/04/21 HTML / CSS
浅谈Python中的函数(def)及参数传递操作
2021/05/25 Python