重置角度倒计时指令

时间:2014-03-24 17:33:27

标签: javascript angularjs timeout

我有一个倒计时指令,一旦模态警告用户他们的会话即将超时,它就会从元素中的初始值倒数到0。倒计时到达零后,将提示用户使用模式退出或继续。如果他们点击继续,最终如果他们得到相同的会话到期警告模式,则计数器为0.我无法弄清楚如何重置计数器指令而不返回它并在将来的所有警告上停止它。这是我现在的代码。

.directive("ndCountdown", function($timeout, $compile){
    return{
        restrict: 'A',
        link: function(scope, element, attrs){
            var countdown = function(){
                var timer = element.find('strong');
                for(var i = 0; i < timer.length; i++){
                    var secs = parseInt(timer.text(), 10) - 1;
                    if(secs >= 0){
                        timer.text(secs);
                    } else{
                        //reset the element to the original value
                        //stop the timeout in this session but have it continue to 
                        //work in future dialogs.
                    }
                }
                $timeout(countdown, 1000);
            }
            countdown();
        }
    }
});

1 个答案:

答案 0 :(得分:1)

第一步是保存最初内部的变量。然后,如果你不在最后,则只运行超时。

.directive("ndCountdown", function($timeout, $compile){
return{
    restrict: 'A',
    link: function(scope, element, attrs){
        var timer = element.find('strong'),
            MAX   = parseInt(timer.text());
        var countdown = function(){
            for(var i = 0; i < timer.length; i++){
                var secs = parseInt(timer.text(), 10) - 1;
                if(secs >= 0){
                    timer.text(secs);
                    $timeout(countdown, 1000);
                } else{
                    timer.text(MAX);
                }
            }
        }
        countdown();
    }
}
});

现在,如果您需要重新启动它,您可能希望与控制器进行通信。也许像这样的广播。 请务必注入$ rootScope

$rootScope.$broadcast('event:start-countdown');

然后在你的指令中,在链接函数的末尾添加它,并注入$ rootScope。试。

$rootScope.$on('event:start-countdown', function() {
    countdown();
}