AngualrJs清除定时器遇到的坑

 更新时间:2017年10月13日 10:24:22   作者:~西门紫凌~  
这篇文章主要介绍了AngualrJs清除定时器遇到的坑,需要的朋友可以参考下

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清除定时器遇到的坑,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • 详解基于Angular4+ server render(服务端渲染)开发教程

    详解基于Angular4+ server render(服务端渲染)开发教程

    本篇文章主要介绍了详解基于Angular4+ server render(服务端渲染)开发教程 ,具有一定的参考价值,有兴趣的可以了解一下
    2017-08-08
  • 简介AngularJS的视图功能应用

    简介AngularJS的视图功能应用

    这篇文章主要介绍了AngularJS的视图功能应用,包括ng-view和ng-template以及$routeProvider的使用,以及 $routeProvider 需要的朋友可以参考下
    2015-06-06
  • AugularJS从入门到实践(必看篇)

    AugularJS从入门到实践(必看篇)

    下面小编就为大家带来一篇AugularJS从入门到实践(必看篇)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • 详解angular笔记路由之angular-router

    详解angular笔记路由之angular-router

    本篇文章主要介绍了详解angular笔记路由之angular-router,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • AngularJS入门教程之AngularJS模型

    AngularJS入门教程之AngularJS模型

    这篇文章主要介绍了AngularJS入门教程之AngularJS模型的相关资料,需要的朋友可以参考下
    2016-04-04
  • angularjs通过过滤器返回超链接的方法

    angularjs通过过滤器返回超链接的方法

    这篇文章主要介绍了angularjs通过过滤器返回超链接的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-10-10
  • AngularJS中$watch和$timeout的使用示例

    AngularJS中$watch和$timeout的使用示例

    这篇文章给大家介绍了AngularJS中$watch和$timeout的使用例子,通过示例代码相信更能让大家理解,有需要的朋友们下面来一起看看吧。
    2016-09-09
  • angular-ngSanitize模块-$sanitize服务详解

    angular-ngSanitize模块-$sanitize服务详解

    本篇文章主要介绍了angular-ngSanitize模块-$sanitize服务详解 ,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • 详解Angular Forms中自定义ngModel绑定值的方式

    详解Angular Forms中自定义ngModel绑定值的方式

    在Angular应用中有两种方式来实现表单绑定,但是对于一些特殊的表单控件没法实现,这篇文章主要介绍了详解Angular Forms中自定义ngModel绑定值的方式,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-12-12
  • angular 实现下拉列表组件的示例代码

    angular 实现下拉列表组件的示例代码

    这篇文章主要介绍了angular 实现下拉列表组件的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-03-03

最新评论