An angular directive that will let you use Identified sham spinner.
3 people use it
Author: 88c3aca00a32d4b4a06cd94095893eca? harinair

Angular Sham Spinner

This contains sham-spinner directive that allows you to add Identified Sham Spinner to Angular applications easily.


In 0.10 and above the sham-spinner element will not be hidden. A new div sham-spinner-blocker is added. Checkout the sample scss on how to configure it.


  • sham-spinner
  • angularjs 1.2.0 (for latest version)


Use bower to install angular-sham-spinner. This will also install sham-spinner bower component.

In the index.html add the directive and the reference to the script. The attribute text will be shown beside the spinner.

Enable the angularShamSpinner module in your app.js or any application config javascript. js angular.module('yourApp', [ 'ngRoute', 'ngResource', 'ngSanitize', 'ngAnimate', 'angularShamSpinner']);

Import Sham Spinner scss and add appropriate style for class sham-spinner-container, spinner and text. The following style will show the spinner on the top left corner.

The following is another example where the spinner is shown in the middle of the page blocking the view.

Disabling Sham Spinner

(Available from release 0.0.6)

Sometimes it may be necessary to disable the spinner. For example, if the spinner is blocking the view and you are using AJAX to do validation of user input, it may be a good idea to disable the spinner until the current call is complete.

In your controller, directive or service, you can inject the AngularShamNotification. The AngularShamNotification has a method: setDisabled(disable, resetTime). If resetTime (in milliseconds) is provided, the spinner will enable itself after the resetTime. Set resetTime to a negative number to disable automatic reset. In that case, you may have to manually reset the spinner by invoking this method with 'false' argument.



The MIT License

comments powered by Disqus
This page was last updated over 4 years ago.