window.setInterval（）在angular.js中无法正常工作

问题描述：

我在angular.js控制器中使用了setInterval（）函数来稍后在UI上显示定时器。创建一个范围变量，其值在几秒钟内处于非活动状态。window.setInterval（）在angular.js中无法正常工作

setInterval(function(){ scope.timer++ }, 1000);

它应该做的是，它应该每秒更新一次屏幕。但事实并非如此。有一段时间它会在两秒钟后更新屏幕，三秒钟，并且每秒更新一次，但不一致。而我登录的范围。计时器值的行为正确。

这会是什么问题。 angular.js是否以某种方式限制原生JavaScript或什么？

有关其他参考：https://www.sitepoint.com/understanding-angulars-apply-digest/ –

答

使用范围。$应用

setInterval(function(){ scope.timer++; scope.$apply(); }, 1000);

的setInterval是没有棱角功能，使范围不清爽。

或者用角服务（者优先的解决方案）：

我相信使用$间隔首选，建议不是做$适用于这种情况下 –

Yee @GopinathShiva感谢评论我更新了答案 –

欣赏:) –

答

可能的值更新在controller但不是在DOM 试试这个

setInterval(function(){ 
scope.timer++ 
setTimeout(function(){ 
    $scope.$apply(); 
}, 1); 
}, 1000);

或者您可以使用$interval并且您正在遵循我的回答y您可以同时使用$timeout代替的setTimeout也

答

您应该使用$interval

更新您的代码以这种

$interval(function(){ 
    $scope.timer++; 
}, 1000)

确保您$scope.timer是正确初始化

答

setInterval不是一个角功能，因此范围不刷新，我不建议使用scope.$apply()作为其浪费。

使用角度的内置$interval方法：

.controller('ExampleController', ['$scope', '$interval', 
    function($scope, $interval) { 
     stop = $interval(function() { 
      $scope.timer++; 
     }, 1000); 
});

文档：https://docs.angularjs.org/api/ng/service/ $间隔

答

更好是使用$interval，例如：

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

 
app.controller('AppCtrl', function($scope, $interval) { 
 
    $scope.timer = 0; 
 
    $interval(function() { $scope.timer++; }, 1000); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
 

 
<div ng-controller="AppCtrl" ng-cloak="" ng-app="MyApp"> 
 
    <div ng-bind="timer"></div> 
 
</div>

答

您可以尝试采用了棱角分明的$interval，从docs

你将它添加到您的控制器，并使用它，就像this（查看Plunker）

app.controller('testController', ['$scope', '$interval', function($scope, $interval) { 
    var count = 1; 
    $scope.count = count; 
    $interval(function() { 
    $scope.count++; 
    }, 1000); 
}]);

答

的setInterval是JS原生功能，来执行它在摘要循环内部，您应该调用apply（）方法，或者使用AngularJS文档中建议的wrapper $ interval。

$interval(function(){ scope.timer++ }, 1000);

https://docs.angularjs.org/api/ng/service/ $间隔

window.setInterval（）在angular.js中无法正常工作

相关推荐