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 相关文章推荐
Extjs Ajax 乱码问题解决方案
Apr 15 Javascript
使用jquery读取html5 localstorage的值的方法
Jan 04 Javascript
js与jquery获取父元素,删除子元素的两种不同方法
Jan 09 Javascript
JS中判断null、undefined与NaN的方法
Mar 26 Javascript
jQuery动画出现连续触发、滞后反复执行的解决方法
Jan 28 Javascript
JavaScript自定义等待wait函数实例分析
Mar 23 Javascript
基于jQuery实现点击弹出层实例代码
Jan 01 Javascript
JS 循环li添加点击事件 (闭包的应用)
Dec 10 Javascript
详解Web使用webpack构建前端项目
Sep 23 Javascript
微信小程序仿美团城市选择
Jun 06 Javascript
解决layui富文本编辑器图片上传无法回显的问题
Sep 18 Javascript
JS实现页面侧边栏效果探究
Jan 08 Javascript
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
2006/12/14 PHP
php实现快速排序法函数代码
2012/08/27 PHP
基于Zend的Config机制的应用分析
2013/05/02 PHP
PHP 获取客户端 IP 地址的方法实例代码
2018/11/11 PHP
PHP实现单文件、多个单文件、多文件上传函数的封装示例
2019/09/02 PHP
jQuery UI Datepicker length为空或不是对象错误的解决方法
2010/12/19 Javascript
基于jquery的loading 加载提示效果实现代码
2011/09/01 Javascript
浅析javascript的间隔调用和延时调用
2014/11/12 Javascript
JavaScript随机生成信用卡卡号的方法
2015/04/07 Javascript
Nodejs进阶:基于express+multer的文件上传实例
2016/11/21 NodeJs
jQuery使用Layer弹出层插件闪退问题
2016/12/22 Javascript
Angular2管道Pipe及自定义管道格式数据用法实例分析
2017/11/29 Javascript
基于Vue-cli快速搭建项目的完整步骤
2018/11/03 Javascript
深入解析ES6中的promise
2018/11/08 Javascript
微信小程序实现保存图片到相册功能
2018/11/30 Javascript
JS简易计算器实例讲解
2020/06/30 Javascript
Python实现霍夫圆和椭圆变换代码详解
2018/01/12 Python
Windows下安装Django框架的方法简明教程
2018/03/28 Python
在Python 中同一个类两个函数间变量的调用方法
2019/01/31 Python
Python面向对象程序设计之私有属性及私有方法示例
2019/04/08 Python
tensorboard 可以显示graph,却不能显示scalar的解决方式
2020/02/15 Python
python的dict判断key是否存在的方法
2020/12/09 Python
Python爬虫后获取重定向url的两种方法
2021/01/19 Python
雅诗兰黛美国官网:Estee Lauder美国
2016/07/21 全球购物
家庭户外服装:Hawkshead
2017/11/02 全球购物
纽约海:Sea New York
2018/11/04 全球购物
linux面试题参考答案(6)
2016/06/23 面试题
金融专业个人求职信
2013/09/22 职场文书
实习生个人找工作的自我评价
2013/10/30 职场文书
物流专业大学应届生求职信
2013/11/03 职场文书
上课迟到检讨书
2014/01/19 职场文书
承诺书怎么写
2014/03/26 职场文书
周年庆典答谢词
2015/01/20 职场文书
python 实现定时任务的四种方式
2021/04/01 Python
MySQL删除和插入数据很慢的问题解决
2021/06/03 MySQL
使用CSS连接数据库的方式
2022/02/28 HTML / CSS