angular-spinkit example

HTML

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular-sanitize.js"></script>
<script src="http://urigo.github.io/angular-spinkit/javascripts/angular-spinkit.js"></script>
  <h2>Spinners</h2>

<rotating-plane-spinner ng-show='loading==0'></rotating-plane-spinner>

<double-bounce-spinner ng-show='loading==1'></double-bounce-spinner>

<wave-spinner ng-show='loading==2'></wave-spinner>

<wandering-cubes-spinner ng-show='loading==3'></wandering-cubes-spinner>

<pulse-spinner ng-show='loading==4'></pulse-spinner>

<chasing-dots-spinner ng-show='loading==5'></chasing-dots-spinner>

<circle-spinner ng-show='loading==6'></circle-spinner>

JavaScript

angular.module('spinners', ['angularSpinkit']);

function Main($scope, $timeout) {
    $scope.loading = 0;
    var inc = function(){
        $scope.loading++;;
        if($scope.loading > 7){
            $scope.loading = 0;
        }
        $timeout(inc, 3000);
    }
    
    $timeout(inc, 1000);
}