Angularjs Examples

AJS Examples

AngularJS $timeout Service

The AngularJS $timeout service is similar to JavaScript's window.setTimeout function. In angular it is refer to it through the $timeout service. The $timeout is just wrapper for window.setTimeout function so that it will be easy to override, remove or mocked for testing. The AngularJS $timeout service return promise which can be used to cancel the $timeout task.

The $timeout service is executed provided function on every delay milliseconds.


var promise = $timeout(functionName, 1000);
$timeout(functionName, 1000); 

AngularJS $timeout Service Example

<!DOCTYPE html>  
<head> <!-- -->  
 <script src="//"></script>   
    <meta charset="utf-8">  
    <title>AngularJS $timeout Example</title>  
var app = angular.module('app', []);  
    app.controller("TimeoutController", function ($scope, $timeout) {  
      $scope.counter = 0;
      $scope.promise = '';
      $scope.Counter = function () {  
        $scope.counter = $scope.counter + 1;  
       $scope.StartCounter = function () {
         $scope.promise = $timeout($scope.Counter, 1000);
       $scope.CancelCounter = function () {
         $scope.counter = 0;
<body style="background-color:#DDE4E9;">  
  <fieldset style="background-color:#DDE4E9;">              
    <legend>AngulerJS $timeout Service Example</legend>   
  <div ng-app="app">        
    <div ng-controller="TimeoutController">        
        <button ng-click="StartCounter()">Start Counter</button>
      <button ng-click="CancelCounter()">Cancel Counter</button>
     <p style="font-family:Arial;color:yellow;background:steelblue;padding:3px;width:350px;"  
     >Counter : - {{counter}}</p>   
See Live Example