Javascript AngularJS通知视图对模型的更改

我试图根据控制器中的Javascript日期对象在视图中显示当前时间。我的控制器如下所示：

myApp.controller('DateCtrl', function($scope) {
    var date = new Date();
    $scope.minutes = date.getMinutes();
    $scope.hours = date.getHours();
    $scope.seconds = date.getSeconds();
    var updateTime = function() {
        var date2 = new Date();
        $scope.minutes = date2.getMinutes();
        $scope.hours = date2.getHours();
        $scope.seconds = date2.getSeconds();
    }
    $scope.clickUpdate = function() {
        setInterval(updateTime, 1000);
    }
});

在我看来，我只是：

<div ng-controller="DateCtrl">
    <div>This is the hour: {{ hours }}</div>
    <div>This is the minute: {{ minutes }}</div>
    <div>This is the second: {{ seconds }}</div>
    <button ng-click="clickUpdate()">Click Update Here!</button>
</div>

这是时间：{{hours}
这是分钟：{{minutes}
这是第二个：{seconds}
点击这里更新！

由于某些原因，

setInterval（）

方法只工作一次，我无法让它按照设置每1秒运行一次

updateTime（）

。我输入了一个简单的

console.log（）

语句，它每1秒运行一次……所以我非常困惑

我还签出了

$scope.watch（）

和

$scope.digest（）

，但我不太确定如何使用它们/是否应该在这种情况下使用它们

---

编辑：进一步检查后，似乎

setInterval

工作正常，每1秒调用一次

updateTime（）

，但每次调用后，作用域中的值都不会反映在我的视图中。

这是因为您正在从角度世界（setInterval）之外更改作用域。您必须

$apply

更改：

var updateTime = function() {
    $scope.$apply(function(){
        var date2 = new Date();
        $scope.minutes = date2.getMinutes();
        $scope.hours = date2.getHours();
        $scope.seconds = date2.getSeconds();
    });
}

---

或者使用角度感知功能，如

$timeout

。选中@asgoth answer in以创建角度感知的

setInterval（）

函数。

这是因为您正在从角度世界（setInterval）之外更改范围。您必须

$apply

更改：

var updateTime = function() {
    $scope.$apply(function(){
        var date2 = new Date();
        $scope.minutes = date2.getMinutes();
        $scope.hours = date2.getHours();
        $scope.seconds = date2.getSeconds();
    });
}

---

或者使用角度感知功能，如

$timeout

。选中@asgoth answer in创建一个角度感知的

setInterval（）

函数。

您也可以在更改模型后使用

$scope.$digest（）

，但我认为

$scope.$apply
更好
您也可以在更改模型后使用
$scope.$digest（）
，但我认为，
$scope.$apply
更好
setInterval（updateTime，1000）
出于某种原因，无论我使用“updateTime（）”还是“updateTime”，它都有相同的行为，它不会继续更新自身。更新
updateTime
函数中的作用域值。抱歉，我有点困惑，我的作用域中的值当前不是在updateTime中更新吗？它们在我设置为“var updateTime”的函数中。
setInterval（updateTime，1000）
由于某种原因，无论我使用“updateTime（）”还是“updateTime”，它都有相同的行为，它不会继续更新自身。更新
updateTime
函数中的范围值。抱歉，我有点困惑，我的作用域中的值当前不是在updateTime中更新吗？它们在我设置为“var updateTime”的函数中。$scope。$apply导致调用$digest，整个过程导致“验证”，或者触发所有监视，以查找范围发生更改的任何内容。在angular中，例如$timeout或$http已经有了这段代码。将函数传递给$scope。$apply（）而不是不带参数调用它，允许Angular处理围绕任何代码执行的包装错误处理。$scope。$apply会导致调用$digest，整个过程会导致“验证”，或者触发所有对任何范围发生更改的监视。在angular中，例如$timeout或$http已经有了这段代码。将函数传递给$scope。$apply（）而不是在没有参数的情况下调用它，允许Angular处理围绕任何代码执行的包装错误处理。