javascript Angular JS - 变量更新间隔
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23232516/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Angular JS - Variable Updating With Interval
提问by pashOCONNOR
Do angular models work with setIntervaL?
角度模型是否适用于 setIntervaL？
Here's an example.. if I have
这是一个例子..如果我有
<p>{{number}}</p>
<button ng-click="testFunc()">TEST</button>
For some reason it updates WITHOUT setInterval, but like this it doesn't:
出于某种原因，它在没有 setInterval 的情况下更新，但像这样它没有：
scope.testFunc = function(){
setInterval(function(){
scope.number--;
},1000);
};
Without setInterval the number will update every single click, but with setInverval it won't update continuously. If I click it every 5 seconds it'll jump a bunch of numbers up (so it's running in the background but the view isn't updating).
如果没有 setInterval，则每次单击都会更新该数字，但使用 setInverval 它不会连续更新。如果我每 5 秒点击一次它，它就会跳出一堆数字（所以它在后台运行但视图没有更新）。
回答by Tyler McGinnis
What's happening is that you're using setIntervalwhich is outside of "Angular's world" so it's not updating the DOM. You have two options, one is a lot better than the other.
发生的事情是您使用的setInterval是“Angular 的世界”之外的内容，因此它不会更新 DOM。你有两种选择，一种比另一种好很多。
Use $interval. It's just like setIntervalexcept it's part of the Angular world, so those changes will update your view (be sure to pass $interval into your directive).
使用$interval. 这就像setInterval除了它是 Angular 世界的一部分之外，所以这些更改将更新您的视图（确保将 $interval 传递到您的指令中）。
scope.testFunc = function(){
$interval(function(){
scope.number--;
},1000);
};
The second option is to call apply() on your current code to kick off a digest cycle, don't do that though since there is a better option.
第二种选择是在当前代码上调用 apply() 以启动摘要循环，但不要这样做，因为有更好的选择。
回答by Tiago Barreto
See the documentation for the interval in angular js Interval with Angular JS
请参阅 angular js Interval with Angular JS 中的间隔文档
You don't to use the $digestto work with interval. See the code below:
您不要使用$digest来处理间隔。请参阅下面的代码：
HTML
HTML
<div ng-app ng-controller="ApplicationController">
<pre>Number: {{ number }}</pre>
<button ng-click="testTimer()">Test Timer</button>
</div>
JS
JS
function ApplicationController($scope,$interval) {
$scope.number = 99999;
$scope.testTimer = function() {
$interval(function() {
$scope.number--;
}, 100);
};
}
See this example in action here
在此处查看此示例
回答by tgeery
Angular comes with a nice wrapper for setInterval. Use it nearly the same way.
Angular 为 setInterval 提供了一个很好的包装器。以几乎相同的方式使用它。
回答by 3066d0
$interval works definitely you can learn more about it at: https://docs.angularjs.org/api/ng/service/$interval
$interval 绝对有效，您可以在以下位置了解更多信息：https: //docs.angularjs.org/api/ng/service/$interval
as a further note, instead of using {{ number }}try using <p ng-model="number"></p>to show your value instead.
进一步说明，不要使用{{ number }}try using<p ng-model="number"></p>来显示您的价值。
回答by pashOCONNOR
Tried using $interval but it returned Error: $interval is not defined.... BUT $digest() worked:
尝试使用 $interval 但它返回 Error: $interval is not defined .... 但是 $digest() 有效：
scope.testFunc = function(){
setInterval(function(){
scope.number--;
scope.$digest();
},1000);
};
