正在自动调用AngularJS控制器中的setInterval函数

时间:2015-06-11 13:27:05

标签: angularjs

我刚刚开始学习角度js。我正在阅读一些教程,并在下面的代码中有点困惑。

app.controller('MyController', function($scope) {
    $scope.person = { name: "Ari Lerner" };
    var updateClock = function() {
    $scope.clock = new Date();
    };
    var timer = setInterval(function() {
      $scope.$apply(updateClock);
      }, 1000);
    updateClock();
});    

从执行开始,我理解的是setInterval函数将在1秒的时间间隔内调用updateClock函数。但我不明白这个流程。由于我没有在任何地方调用此函数setInterval,它是如何被调用的?我所做的只是在我的视图中使用表达式{{clock}}。 感谢

3 个答案:

答案 0 :(得分:2)

setInterval是一种内置的JavaScript方法。它作为第二个参数执行传递给它的函数作为每个毫秒传递的第一个参数。此方法返回一个id,clearInterval可以使用该ID来取消间隔。

一旦调用此方法,它将继续无限期地执行传递的函数,直到您调用clearInterval传递setInterval返回的id

关于您的代码,您通过将函数传递给execute setInterval milisecond来调用1000。由于您使用的是angularJs,因此可以使用$interval angular的服务,但它也会运行$ digest循环,以便更新绑定。

您可以像这样更改代码

app.controller('MyController', function($scope, $interval) {
    $scope.person = { name: "Ari Lerner" };
    var updateClock = function() {
       $scope.clock = new Date();
    };
    $interval(updateClock, 1000);
    updateClock();
});  

答案 1 :(得分:0)

setInterval函数需要初始化一次。在首次设置timer变量时将初始化,然后以1000毫秒的间隔计算表达式$scope.$apply(updateClock);

请参阅exampleexample

答案 2 :(得分:0)

在此控制器中, setInterval 方法每隔1秒自动调用一次,无论何时调用它,它都会点击 updateClock 方法,并且在此方法变量&#39; < strong>时钟($ scope.clock)&#39;获取系统当前日期和时间。

简而言之,通过使用setInterval函数(每秒点击updateClock功能),您将获得当前系统时间。