1

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

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>

出于某种原因，该setInterval()方法只工作一次，我无法让它updateTime()按照设置每 1 秒运行一次。我输入了一个简单的console.log()语句，每 1 秒运行一次……所以我很困惑。

我也检查过$scope.watch()，$scope.digest()但我不太确定如何使用它们/如果我应该在这种情况下使用它们。

编辑：经过进一步检查，看起来好像setInterval工作正常，updateTime()每 1 秒调用一次，但每次调用后范围内的值都没有反映在我的视图中。

4

2 回答 2

7

这是因为您正在从角度世界（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 答案以创建角度感知 setInterval()功能。

于 2013-07-25T03:06:13.183 回答
-2

你也可以$scope.$digest() 在你改变模型后使用，但我认为$scope.$apply更好

于 2014-07-09T07:29:37.123 回答