Question

在我的一个应用程序中，基于角度的应用程序编写了用户会话时间，如果用户空闲10分钟，在第5分钟弹出警告，10分钟后需要注销。

以下代码适用于该应用程序。在一个模块中必须清除setinterval，我无法通过使用来清除它 **clearInterval(idleCheck);**。在下面的代码中出现了问题。

角度运行块已实现用户在状态之间导航，将时间延长10分钟。

myApp.run(function ($rootScope $interval, $timeout, $state) {

    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, $rootScope, $state, $location) {   

       lastDigestRun = Date.now();

       var m = lastDigestRun + 10 * 60 * 1000;      

        idleCheck = setInterval(function () {

              var now = Date.now();


                if (now - lastDigestRun > 5 * 60 * 1000) {
                    // show the pop up , the pop have continue to extend the time session if proceed        
                }
                if (now - lastDigestRun > 10 * 60 * 1000) {
                    // LOgout functionality
                }
            }
        }, 60 * 1000);


    });
});

如果用户有一些服务器请求，则意味着在此块中延长时间以再次添加时间。

我必须清除会话，如果url是这样的话;试图清除它不清除。

    if (url == 'stopsession') {               
                  clearInterval(idleCheck);

              }


var configFunction = function ($stateProvider, $httpProvider, $urlRouterProvider, $locationProvider,$scope) {
   var interceptor = function ($q, $rootScope, $timeout, $location) {
      return {
          request: function (config) {
          //  consider this module reuest come here
              if (url == 'stopsessionurl') {               
                  clearInterval(idleCheck);

              }

其他{

                  lastDigestRun = Date.now();
                  var m = lastDigestRun +  10 * 60 * 1000;
                   idleCheck = setInterval(function () {

                          var now = Date.now();

                          if (now - lastDigestRun > 5 * 60 * 1000) {
                              // show pop up  to extend the time if click continue another 10 minutes gets added
                          }
                          if (now - lastDigestRun > 10 * 60 * 1000) {
                            // logout functionality
                          }

                  }, 60 * 1000);
                  return config;
              }
          },
            requestError: function (config) {            
                return config;
            },

            response: function (response) {

            },
            responseError: function (rejection) {


            }
        }
    };

    $httpProvider.interceptors.push(interceptor);
    };

所以在一个模块中必须停止setInterval.But ClearInterval没有停止。

这是完整的代码。

var idleCheck;

var myApp = angular.module('myApp','ui.router');
myApp.run(function ($rootScope $interval, $timeout, $state) {

    $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, $rootScope, $state, $location) {   

       lastDigestRun = Date.now();

       var m = lastDigestRun + 10 * 60 * 1000;      

        idleCheck = setInterval(function () {

              var now = Date.now();


                if (now - lastDigestRun > 5 * 60 * 1000) {
                    // show the pop up , the pop have continue to extend the time session.

                }
                if (now - lastDigestRun > 10 * 60 * 1000) {
                    // LOgout functionality
                }
            }
        }, 60 * 1000);


    });
});

var configFunction = function ($stateProvider, $httpProvider, $urlRouterProvider, $locationProvider,$scope) {
   var interceptor = function ($q, $rootScope, $timeout, $location) {
      return {
          request: function (config) {

              if (url == 'stopsession') {               
                  clearInterval(idleCheck);

              }
              else {

                  lastDigestRun = Date.now();
                  var m = lastDigestRun + 10 * 60 * 1000;
                   idleCheck = setInterval(function () {

                          var now = Date.now();

                          if (now - lastDigestRun > 5 * 60 * 1000) {
                              // show pop up  to extend the time if click continue another 10 minutes gets added
                          }
                          if (now - lastDigestRun > 10 * 60 * 1000) {
                            // logout functionality
                          }

                  }, 60 * 1000);
                  return config;
              }
          },
            requestError: function (config) {            
                return config;
            },

            response: function (response) {

            },
            responseError: function (rejection) {


            }
        }
    };

    $httpProvider.interceptors.push(interceptor);
    };

问题：

但无法清除间隔。

如果我使用$ interval，则时间不正常并且无法使用$ interval.cancel清除 Github：演示：https://github.com/MohamedSahir/UserSession

步骤：浏览视频详细了解问题：演示视频：http://recordit.co/xHkJeUSdp1 演示人员：https://plnkr.co/edit/UkVUvFWIQKYD6SUumNv4?p=preview

Answer 1

使用AngularJS时，您应该使用$interval服务。

在你的情况下，它会像这样（对你需要创建的每个间隔重复相同）：

//... set interval
        idleCheck = $interval(function () {

              //... your code (omitted)

        }, 60 * 1000);
//...

//...clear interval
       $interval.cancel(idleCheck);
//...

Answer 2

不要在angular中使用setInterval。

AngularJS为setInterval提供了一个非常好的$ interval包装器，它提供了一个promise API。

https://docs.angularjs.org/api/ng/service/$interval

PS：你正在注射它但你没有使用它。

为什么无法在javascript中清除SetInterval？这种做法是错误的吗？

2 个答案: