切换选项卡时AngularJS $timeout不活动

Question

我的应用程序中有计时器功能。用户可以启动计时器来测量完成特定任务所花费的时间。我将开始时间和结束时间保留在后端，以便获得总时间。但我需要向用户显示经过的时间。我使用$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 功能无效或变慢，显示的时间显着变慢。有没有办法解决这个问题？我能找到用户切换标签的确切时间吗？

Answer 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());
    });