Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
<html>
<head>
<title>Interval Example - Ticker and Promises</title>
<script type="text/javascript" src="https://code.angularjs.org/1.4.0-rc.2/angular.js"></script>
</head>
<body ng-app="calculatorApp">
<div ng-controller="CalculatorController">
Ticker: {{ticker}}
<br><br>
<label>From:</label>
<input type="number" ng-model="from">
<label>Inc:</label>
<input type="number" ng-model="inc">
<input type="button" value="Start" ng-click="start()">
<input type="button" value="Cancel" ng-click="cancel()">
<h4>Debug Output</h4>
<div>{{debug}}</div>
</div>
<script type="text/javascript">
var app = angular.module('calculatorApp', []);
app.controller('CalculatorController', function calculatorController($scope, $interval) {
var counterInstance;
var counterFunction = function(start, inc) {
if ($scope.ticker === 0 && start)
$scope.ticker = start;
if (!inc)
inc = 1;
$scope.ticker += inc;
}
var debugOutput = function(msg) {
// logging for demo
$scope.debug += msg + ' * ';
}
// defaults
$scope.ticker = 0;
$scope.from = 0;
$scope.inc = 1;
$scope.start = function() {
$scope.debug = '';
counterInstance = $interval(counterFunction, 500, 3, true, $scope.from, $scope.inc);
debugOutput('Starting status: ' + counterInstance.$$state.status);
counterInstance.then(function(successCallback, errorCallback, notifyCallback) {
debugOutput('The interval was executed: ' + successCallback + ' times!');
debugOutput('Then status: ' + counterInstance.$$state.status);
// errorCallback (always undefined for interval)
// notifyCallback (always undefined for interval)
});
counterInstance.catch(function(errorCallback) {
// called when the interval is cancelled
if (errorCallback === 'canceled') {
debugOutput('The interval was cancelled!');
} else {
debugOutput('Something else went wrong!');
}
debugOutput('Catch status: ' + counterInstance.$$state.status);
});
counterInstance.finally(function() {
// always called regardless
// Status values:
// 0 for running
// 1 for done
// 2 for cancelled
debugOutput('Finally status: ' + counterInstance.$$state.status);
counterInstance = undefined;
});
}
$scope.cancel = function() {
if (angular.isDefined(counterInstance)) {
$interval.cancel(counterInstance);
}
}
$scope.$on('$destroy', function() {
$scope.cancel();
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment