AngularJS module for slide animation digits inside numbers

Added by: Sam Deering





Stars: 2

Watchers: 2

Forks: 0


Udi Talias
Udi Talias

Module Description

live-digits v1.0.0

AngularJS module for slide animation digits inside numbers

Working Demo

##installation $ bower install --save live-digits


Just import live-digits.min.js and live-digits.min.css and add it to your app module

  <link rel="stylesheet" href="bower_components/live-digits/dist/live-digits.css" />
  <script src="bower_components/live-digits/dist/live-digits.min.js"></script>
    angular.module('myApp', [''])
      .controller('mainController', ['$scope', '$timeout', function ($scope, $timeout) {
          $scope.liveValue = 100000;
          function _updateLiveValue() {
            $scope.liveValue = (Math.random() * 200000) + 100000;
            $timeout(_updateLiveValue, 1000);

<body ng-app="myApp" ng-controller="mainController">
  <!-- use the directive like this example: -->
  <live-digits value="liveValue" duration="300"></live-digits>


The only 2 options you can config are value and duration

The value is the number (or string yeah!) which will be watched by the directive to animate the value change.

The duration is optional and specifies the animation duration in milliseconds (default is 200).


"dependencies": {
  "angular": ">=1.x",
  "jquery": ">=1.x"


Clone the project and run:

$ npm install

$ grunt build

The dist/ folder will erase and the new build files will be copy into it



Module stats last updated: 2015-04-28 11:07:05

Disclaimer: Some data on this page may have been gathered from the authors GitHub respository. If you see any mistakes or outdated information please let us know. Thanks!