Javascript 如何清除或停止angularjs中的timeInterval?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/26447923/
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
How to clear or stop timeInterval in angularjs?
提问by user944513
I am making a demo in which I am fetching data from the server after regular intervals of time using $intervalNow I need to stop/cancel this.
我正在制作一个演示,其中我在使用$intervalNow 我需要停止/取消它的固定时间间隔后从服务器获取数据。
How I can achieve this? If I need to restart the process, how should I do that?
我怎么能做到这一点?如果我需要重新启动该过程,我应该怎么做?
Secondly, I have one more question: I am fetching data from the server after reqular intervals of time. Is there any need to use $scope.applyor $scope.watch?
其次,我还有一个问题:我在固定的时间间隔后从服务器获取数据。有没有必要用$scope.apply或$scope.watch?
Here is my plunker:
这是我的plunker:
app.controller('departureContrl',function($scope,test, $interval){
setData();
$interval(setData, 1000*30);
function setData(){
$scope.loading=true;
test.stationDashBoard(function(data){
console.log(data);
$scope.data=data.data;
$scope.loading=false;
//alert(data);
},function(error){
alert('error')
}) ;
}
});
回答by ryeballar
You can store the promise returned by the interval and use $interval.cancel()to that promise, which cancels the interval of that promise. To delegate the starting and stopping of the interval, you can create start()and stop()functions whenever you want to stop and start them again from a specific event. I have created a snippet below showing the basics of starting and stopping an interval, by implementing it in view through the use of events (e.g. ng-click) and in the controller.
您可以存储由间隔返回的承诺并用于$interval.cancel()该承诺,这将取消该承诺的间隔。要委托时间间隔的开始和停止,您可以在想要从特定事件停止和再次启动它们时创建start()和stop()函数。我在下面创建了一个片段,显示了启动和停止间隔的基础知识,通过使用事件(例如ng-click)和控制器在视图中实现它。
angular.module('app', [])
.controller('ItemController', function($scope, $interval) {
// store the interval promise in this variable
var promise;
// simulated items array
$scope.items = [];
// starts the interval
$scope.start = function() {
// stops any running interval to avoid two intervals running at the same time
$scope.stop();
// store the interval promise
promise = $interval(setRandomizedCollection, 1000);
};
// stops the interval
$scope.stop = function() {
$interval.cancel(promise);
};
// starting the interval by default
$scope.start();
// stops the interval when the scope is destroyed,
// this usually happens when a route is changed and
// the ItemsController $scope gets destroyed. The
// destruction of the ItemsController scope does not
// guarantee the stopping of any intervals, you must
// be responsible for stopping it when the scope is
// is destroyed.
$scope.$on('$destroy', function() {
$scope.stop();
});
function setRandomizedCollection() {
// items to randomize 1 - 11
var randomItems = parseInt(Math.random() * 10 + 1);
// empties the items array
$scope.items.length = 0;
// loop through random N times
while(randomItems--) {
// push random number from 1 - 10000 to $scope.items
$scope.items.push(parseInt(Math.random() * 10000 + 1));
}
}
});
<div ng-app="app" ng-controller="ItemController">
<!-- Event trigger to start the interval -->
<button type="button" ng-click="start()">Start Interval</button>
<!-- Event trigger to stop the interval -->
<button type="button" ng-click="stop()">Stop Interval</button>
<!-- display all the random items -->
<ul>
<li ng-repeat="item in items track by $index" ng-bind="item"></li>
</ul>
<!-- end of display -->
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
回答by Arun Sharma
var interval = $interval(function() {
console.log('say hello');
}, 1000);
$interval.cancel(interval);
回答by Jijo Paulose
var promise = $interval(function(){
if($location.path() == '/landing'){
$rootScope.$emit('testData',"test");
$interval.cancel(promise);
}
},2000);
回答by Christian Bonato
$scope.toggleRightDelayed = function(){
var myInterval = $interval(function(){
$scope.toggleRight();
},1000,1)
.then(function(){
$interval.cancel(myInterval);
});
};
回答by pixparker
When you want to create interval store promise to variable:
当您想为变量创建间隔存储承诺时:
var p = $interval(function() { ... },1000);
And when you want to stop / clear the interval simply use:
当您想停止/清除间隔时,只需使用:
$interval.cancel(p);

