Angularjs 范围变量仅在第一次更新

我面临一个非常奇怪的问题，我使用angular js创建秒表，我使用以下代码更新计时器

$scope.seconds = $scope.minutes = $scope.hours = "00";

$scope.timer = {
    h: 0,
    m: 0,
    s: 0
};

$scope.runTimer = function() {
    console.log($scope.timer);
    $scope.timer.s++;
    if ($scope.timer.s >= 60) {
        $scope.timer.s = 0;
        $scope.timer.m++;
        if ($scope.timer.m >= 60) {
            $scope.timer.m = 0;
            $scope.timer.h++
        }
    }

    $scope.seconds = $scope.timer.s > 9 ? "" + $scope.timer.s : "0" + $scope.timer.s;
    $scope.minutes = $scope.timer.m > 9 ? "" + $scope.timer.m : "0" + $scope.timer.m;
    $scope.hours = $scope.timer.h > 9 ? "" + $scope.timer.h : "0" + $scope.timer.h;
    $scope.continueTimer();
};

$scope.continueTimer = function() {
    setTimeout($scope.runTimer, 1000);
};

但问题是范围变量

秒

，

分钟

，

小时

的值仅在视图中第一次更新，即，当

ng单击触发
runTimer
方法时，模板将从
00:00:00
更改为
00:00:01
，然后不会更新

使用控制台，我检查了
$scope.seconds
，
$scope.minutes
&
$scope.hours
的值是否正确更新，但视图没有反映正确的值

下面是一个例子，显示了我所面临的确切问题。任何帮助都将不胜感激。谢谢。
使用
$scope.$digest（）
并选中
$scope.$$phase
之前的
$scope.$digest（）

所以你的
app.js
文件代码应该是

var app = angular.module('plunker', []);

    app.controller('MainCtrl', function($scope) {
        $scope.seconds = $scope.minutes = $scope.hours = "00";

        $scope.timer = { 
            h: 0,
            m: 0,
            s: 0
        };  

        $scope.runTimer = function() {
            console.log($scope.timer);
            $scope.timer.s++;
            if ($scope.timer.s >= 60) {
                $scope.timer.s = 0;
                $scope.timer.m++;
                if ($scope.timer.m >= 60) {
                    $scope.timer.m = 0;
                    $scope.timer.h++
                }   
            }   

            $scope.seconds = $scope.timer.s > 9 ? "" + $scope.timer.s : "0" + $scope.timer.s;
            $scope.minutes = $scope.timer.m > 9 ? "" + $scope.timer.m : "0" + $scope.timer.m;
            $scope.hours = $scope.timer.h > 9 ? "" + $scope.timer.h : "0" + $scope.timer.h;
            **if(!$scope.$$phase)
            {
              $scope.$digest();
            }**
            $scope.continueTimer();

        };  

        $scope.continueTimer = function() {
            setTimeout($scope.runTimer, 1000);
        };  
    });

看到这个工作了吗

请检查我的更新答案：）我必须使用$scope。$apply（）；而不是消化，但这为我指明了正确的方向
var app = angular.module('plunker', []);

    app.controller('MainCtrl', function($scope) {
        $scope.seconds = $scope.minutes = $scope.hours = "00";

        $scope.timer = { 
            h: 0,
            m: 0,
            s: 0
        };  

        $scope.runTimer = function() {
            console.log($scope.timer);
            $scope.timer.s++;
            if ($scope.timer.s >= 60) {
                $scope.timer.s = 0;
                $scope.timer.m++;
                if ($scope.timer.m >= 60) {
                    $scope.timer.m = 0;
                    $scope.timer.h++
                }   
            }   

            $scope.seconds = $scope.timer.s > 9 ? "" + $scope.timer.s : "0" + $scope.timer.s;
            $scope.minutes = $scope.timer.m > 9 ? "" + $scope.timer.m : "0" + $scope.timer.m;
            $scope.hours = $scope.timer.h > 9 ? "" + $scope.timer.h : "0" + $scope.timer.h;
            **if(!$scope.$$phase)
            {
              $scope.$digest();
            }**
            $scope.continueTimer();

        };  

        $scope.continueTimer = function() {
            setTimeout($scope.runTimer, 1000);
        };  
    });