选项卡切换时,AngularJS $超时无效

时间:2017-01-09 06:52:50

标签: angularjs settimeout

我的应用程序中有一个计时器功能。用户可以启动计时器来测量完成特定任务所花费的时间。我将开始时间和结束时间保留在后端,这样我就得到了总时间。但是我需要向用户显示经过的时间。我使用$timeout函数每秒调用一个函数来显示时间。

function displayTime(){
               time = time + 1;
               var hours,minutes,seconds;
               hours = parseInt((time/3600)%24);
               minutes = parseInt((time/60)%60);
               seconds = time%60;
               $scope.timer = hours+ ":"+minutes+":"+seconds;
               t = $timeout(displayTime,1000);
           }

但是当切换选项卡时,$ timeout功能处于非活动状态或速度变慢,显示的时间显着减慢。有没有办法解决这个问题?我可以找到用户切换标签的确切时间吗?

1 个答案:

答案 0 :(得分:1)

使用“$ interval”服务而不是“$ timeout”。

angular.module('myApp',[])
    .controller('exampleCtrl', function($scope, $interval) {

        var timeInterval;

        function startDisplayTime(time) {
            var fnTime = function(t) {
               var hours,minutes,seconds;
               hours = parseInt((t/3600)%24);
               minutes = parseInt((t/60)%60);
               seconds = t%60;
               $scope.timer = hours+ ":"+minutes+":"+seconds; 
            };

            var ntime = time + 1;
            timeInterval = $interval(fnTime(ntime), 10000);
        }

        function stopDisplayTime() {
           $interval.cancel(timeInterval);
        }


        ....


        startDisplayTime(someLogicForGetTime());
    });