I was trying the code given in angularjs docs (given here: http://jsfiddle.net/zGqB8/) It just implements a time factory and uses $timeout to update the time object after each second.
angular.module('timeApp', [])
.factory('time', function($timeout) {
var time = {};
(function tick () {
time.now = new Date().toString();
$timeout(tick, 1000); // how to do it using setInterval() ?
})();
return time;
});
How would I do it using setInterval() function instead of $timeout() ?
I know that one need to use scope.$apply()
to enter the angular execution context but how would that work in a factory function? I mean, in a controller, we have a scope, but we don't have scope in a factory function?
AngularJS includes $interval service which performs the same task as setInterval() method in JavaScript. The $interval is a wrapper for setInterval() method, so that it will be easy to override, remove or mocked for testing. The $interval service executes the specified function on every specified milliseconds duration.
The setInterval() method calls a function at specified intervals (in milliseconds). The setInterval() method continues calling the function until clearInterval() is called, or the window is closed.
setInterval() The setInterval() method, offered on the Window and Worker interfaces, repeatedly calls a function or executes a code snippet, with a fixed time delay between each call. This method returns an interval ID which uniquely identifies the interval, so you can remove it later by calling clearInterval() .
“setinterval for 5 times” Code Answer'svar intervalID = setInterval(alert, 1000); // Will alert every second. // clearInterval(intervalID); // Will clear the timer. setTimeout(alert, 1000); // Will alert once, after a second.
You can use $timeout
as an interval.
var myIntervalFunction = function() { cancelRefresh = $timeout(function myFunction() { // do something cancelRefresh = $timeout(myIntervalFunction, 60000); },60000); };
If the view is destroyed, you can destroy it with listening on $destroy
:
$scope.$on('$destroy', function(e) { $timeout.cancel(cancelRefresh); });
Update
Angular has implemented an $interval feature in version 1.2 - http://docs.angularjs.org/api/ng.$interval
Legacy example below, disregard unless you're using a version older than 1.2.
A setInterval implementation in Angular -
I've created a factory called timeFunctions, which exposes $setInterval and $clearInterval.
Note that any time I've needed to modify scope in a factory I've passed it in. I am unsure if this meets the "Angular way" of doing things, but it works well.
app.factory('timeFunctions', [
"$timeout",
function timeFunctions($timeout) {
var _intervals = {}, _intervalUID = 1;
return {
$setInterval: function(operation, interval, $scope) {
var _internalId = _intervalUID++;
_intervals[ _internalId ] = $timeout(function intervalOperation(){
operation( $scope || undefined );
_intervals[ _internalId ] = $timeout(intervalOperation, interval);
}, interval);
return _internalId;
},
$clearInterval: function(id) {
return $timeout.cancel( _intervals[ id ] );
}
}
}
]);
Example Usage:
app.controller('myController', [
'$scope', 'timeFunctions',
function myController($scope, timeFunctions) {
$scope.startFeature = function() {
// scrollTimeout will store the unique ID for the $setInterval instance
return $scope.scrollTimeout = timeFunctions.$setInterval(scroll, 5000, $scope);
// Function called on interval with scope available
function scroll($scope) {
console.log('scroll', $scope);
$scope.currentPage++;
}
},
$scope.stopFeature = function() {
return timeFunctions.$clearInterval( $scope.scrollTimeout );
}
}
]);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With