我正在制作一个演示,其中我将使用固定时间间隔从服务器上获取数据,$interval现在我需要停止/取消此操作。
$interval
我该如何实现?如果需要重新启动该过程,该怎么办?
其次,我还有一个问题:经过规定的时间间隔后,我正在从服务器获取数据。有需要使用$scope.apply还是$scope.watch?
$scope.apply
$scope.watch
这是我的朋克:
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') }) ; } });
http://plnkr.co/edit/ly43m5?p=preview
您可以存储间隔返回的承诺并用于$interval.cancel()该承诺,这将取消该承诺的间隔。要委派间隔的开始和停止,您可以在要停止并从特定事件重新启动它们时创建start()和stop()运行它们。我在下面创建了一个片段,通过使用事件(例如ng- click)和在控制器中实现间隔来开始和停止间隔。
$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>