How to show counter in angular js
Trying to create a countdown demo using angular js.
Once you are idle for 30 seconds, I need to show a countdown from 10 to 0,
How to implement a countdown timer.
here is what i tried.
var time = $timeout(function () {
$rootScope.$broadcast('shutdwon');
setTimeout( function () {
$location.path('/');
}, 1500);
}, 30000);
+3
source to share
2 answers
Just try this
Html
<div ng-app ng-controller="countController">Count starts after 30 seconds<div>Count :: {{countDown}}</div>
<div>
script
function countController($scope, $timeout) {
$scope.countDown = 10;
var time = $timeout(function () {
var timer = setInterval(function () {
if ($scope.countDown > 0) {
$scope.countDown--;
} else {
clearInterval(timer)
}
$scope.$apply();
}, 1500);
}, 30000);
}
+2
source to share
I did this to show the session time information.
Check out the following code example. Which can be improved and used according to your requirements.
function MyCtrl($scope,$timeout) {
$scope.isUserActive = false;
$scope.userActivityInterval = 1000;
$scope.redirectLoginInterval =10000;
$scope.timerSpan= $scope.redirectLoginInterval/ $scope.userActivityInterval;
$scope.resetActivity=function () {
if ($scope.isUserActive == true) {
clearTimeout($scope.redirectTimer);
$scope.redirectTimer = $timeout( $scope.redirectToLogin, $scope.redirectLoginInterval);
$scope.timerSpan = $scope.redirectLoginInterval/ $scope.userActivityInterval;
}
else {
$scope.timerSpan -= $scope.userActivityInterval / $scope.userActivityInterval;
}
clearTimeout($scope.activityTimer);
$scope.activityTimer = $timeout($scope.resetActivity, $scope.userActivityInterval);
$scope.isUserActive = false;
};
$scope.activityTimer = $timeout($scope.resetActivity, $scope.userActivityInterval);
$scope.redirectTimer = $timeout($scope.resetActivity, $scope.redirectLoginInterval);
}
+2
source to share