AngualrJs清除定時(shí)器遇到的坑

更新時(shí)間：2017年10月13日 10:24:22 作者：~西門紫凌~

這篇文章主要介紹了AngualrJs清除定時(shí)器遇到的坑,需要的朋友可以參考下

angualrJs清除定時(shí)器爬坑之路：

今天發(fā)現(xiàn)一個(gè)奇怪問(wèn)題，放在自定義指令里邊的定時(shí)器竟然在頁(yè)面跳轉(zhuǎn)之后，在另一個(gè)頁(yè)面這個(gè)循環(huán)定時(shí)器還在執(zhí)行，這肯定是不行的，會(huì)影響系統(tǒng)的性能。

我在angular里邊用原生的方法window.onunload方法竟然不管用，所以只好用angular自己的方法$destroy，這頁(yè)面跳轉(zhuǎn)，DOM結(jié)構(gòu)發(fā)生變化是都能清除定時(shí)器

      var timer = setInterval(function(){
          $scope.$apply(function(){
            //這里是想要定時(shí)刷新的邏輯
          });
        },3000);
        $scope.$on('$destroy',function(){
          if (timer) {
            clearInterval(timer);
            timer = null;
          }
        });

這里說(shuō)一下，因?yàn)槲矣玫氖莏avascript中原生的setTimeout()以及setInterval()函數(shù),所以清除時(shí)對(duì)應(yīng)是clearTimeout()和clearInterval()，angular定時(shí)器是$timeOut和$interval，所以清除對(duì)應(yīng)是$timeOut.cancel()和$interval.cancel(),

必須一一對(duì)應(yīng)，不一致是不會(huì)清除掉的。

總結(jié)

以上所述是小編給大家介紹的AngualrJs清除定時(shí)器遇到的坑，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

詳解基于Angular4+ server render(服務(wù)端渲染)開發(fā)教程
本篇文章主要介紹了詳解基于Angular4+ server render(服務(wù)端渲染)開發(fā)教程，具有一定的參考價(jià)值，有興趣的可以了解一下
2017-08-08
簡(jiǎn)介AngularJS的視圖功能應(yīng)用
這篇文章主要介紹了AngularJS的視圖功能應(yīng)用,包括ng-view和ng-template以及$routeProvider的使用，以及 $routeProvider 需要的朋友可以參考下
2015-06-06
AugularJS從入門到實(shí)踐(必看篇)
下面小編就為大家?guī)?lái)一篇AugularJS從入門到實(shí)踐(必看篇)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-07-07
詳解angular筆記路由之a(chǎn)ngular-router
本篇文章主要介紹了詳解angular筆記路由之a(chǎn)ngular-router，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-09-09
AngularJS入門教程之AngularJS模型
這篇文章主要介紹了AngularJS入門教程之AngularJS模型的相關(guān)資料,需要的朋友可以參考下
2016-04-04
angularjs通過(guò)過(guò)濾器返回超鏈接的方法
這篇文章主要介紹了angularjs通過(guò)過(guò)濾器返回超鏈接的方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2018-10-10
AngularJS中$watch和$timeout的使用示例
這篇文章給大家介紹了AngularJS中$watch和$timeout的使用例子，通過(guò)示例代碼相信更能讓大家理解，有需要的朋友們下面來(lái)一起看看吧。
2016-09-09
angular-ngSanitize模塊-$sanitize服務(wù)詳解
本篇文章主要介紹了angular-ngSanitize模塊-$sanitize服務(wù)詳解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-06-06
詳解Angular Forms中自定義ngModel綁定值的方式
在Angular應(yīng)用中有兩種方式來(lái)實(shí)現(xiàn)表單綁定，但是對(duì)于一些特殊的表單控件沒(méi)法實(shí)現(xiàn)，這篇文章主要介紹了詳解Angular Forms中自定義ngModel綁定值的方式，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-12-12
angular 實(shí)現(xiàn)下拉列表組件的示例代碼
這篇文章主要介紹了angular 實(shí)現(xiàn)下拉列表組件的示例代碼，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-03-03