AngularJS:如何在$ watch中链接$ timeout

时间:2014-01-24 06:58:55

标签: javascript angularjs timeout watch

我想在$ watch中链接两个$ timeout方法。 $ watch用于查看用户是否执行了任何操作。如果是,那么我将取消$ timeout实例。这是代码段。

.run(['$rootScope',  '$location', '$timeout', 'applicationCache', function ($rootScope, $location, $timeout, applicationCache) {
var popupTimer, logoutTimer;
var logoutInterval = 10000, popupInterval = 5000;
$rootScope.$watch(function detectIdle() {
    if($rootScope.userLoggedIn){
        (popupTimer) ? $timeout.cancel(popupTimer) : undefined; // check if timer running, cancel it
        (logoutTimer) ? $timeout.cancel(logoutTimer) : undefined; // check if other timer running, cancel it
        popupTimer = $timeout(function(){
                console.log("show popup");
                logoutTimer = $timeout(function(){
                    console.log("logout");
                    $rootScope.userLoggedIn = false; // set logged In status to false
                    applicationCache.removeAll(); // destroy all session storage
                    $location.path("/login");
                },logoutInterval);
            },popupInterval);
    }
});
}])

我想要实现的是在空闲的意识中,在用户5秒钟后显示一个弹出窗口,他/她的会话即将到期。如果没有互动,他会在10秒后退出。如果他交互,则取消定时器并重新初始化弹出定时器。

我面临的问题是,如果根本没有执行任何交互,则内部超时不会被执行。它一旦初始化就会被取消。在控制台中“永远不会打印”。我在控制台中看到的只是“show popup”重复打印。

我猜$ watch会在第二个计时器初始化后立即执行,从而取消内部计时器。

可以采取哪些措施来解决这个问题?

1 个答案:

答案 0 :(得分:0)

我会使用一些布尔变量。见 isInProgress

.run(['$rootScope',  '$location', '$timeout', 'applicationCache', function ($rootScope, $location, $timeout, applicationCache) {
var popupTimer, logoutTimer, isInProgress= false;
var logoutInterval = 10000, popupInterval = 5000;
$rootScope.$watch(function detectIdle() {
    if($rootScope.userLoggedIn && !isInProgress){
        (popupTimer) ? $timeout.cancel(popupTimer) : undefined; // check if timer running, cancel it
        (logoutTimer) ? $timeout.cancel(logoutTimer) : undefined; // check if other timer running, cancel it
        popupTimer = $timeout(function(){
                console.log("show popup");
                logoutTimer = $timeout(function(){
                    isInProgress = false;
                    console.log("logout");
                    $rootScope.userLoggedIn = false; // set logged In status to false
                    applicationCache.removeAll(); // destroy all session storage
                    $location.path("/login");
                },logoutInterval);
            },popupInterval);
    }
    isInProgress = true;
});
}])