add the option to seperate a large number with comma

README.md

@@ -31,4 +31,5 @@ The following attributes can be set as numbers on the directive element.
 - ```count-to```  the number to count to.
 - ```value```  the number to start counting from.
 - ```duration```  how long the count should take in seconds.
+- ```format``` whether seperate a large number with comma. Valid values are "comma" or "".
 

demo/index.html

@@ -5,7 +5,7 @@
     <title>Angular Count Up Demo</title>
     <script src="../test/lib/angular/angular.min.js"></script>
     <script src="../build/angular-count-to.min.js"></script>
-    <!--<script src="../src/count-to.js"></script>-->
+     <!-- // <script src="../src/count-to.js"></script> -->
     <script src="js/app.js"></script>
     <style type="text/css">
         h1.count{
@@ -17,17 +17,19 @@
 <div class="container">
     <h2>Angular count-to directive</h2>
     <div class="hero-unit">
-        <h1 class="count" count-to="{{countTo}}" value="{{countFrom}}" duration="4"></h1><br>
+        <h1 class="count" format="{{commaFormat?'comma':''}}" count-to="{{countTo}}" value="{{countFrom}}" duration="4"></h1><br>
 
         <p>Count to <span class="text-info">{{countTo}}</span> from <span class="text-info">{{countFrom}}</span> over <span class="text-warning">4</span> seconds</p>
 
         <form class="form-horizontal">
             <!--<label for="duration">Duration</label>-->
             <!--<input type="number" name="duration" ng-model="model.duration"/><span class="help-inline"><small>(milliseconds)</small></span>-->
-            <label for="count_to">Count to</label>
+            <label for="count_to">Count to</label> 
             <input type="number" name="count_to" ng-model="countTo"/>
             <label for="count_from">Count from</label>
             <input type="number" name="count_from" ng-model="countFrom"/>
+            <label for="format">Comma format</label>
+            <input name="comma_format" type="checkbox" ng-model="commaFormat"/>
             <br><br>
             <button type="submit" ng-click="reCount()" class="btn btn-inverse btn-large">Randomize</button>
         </form>

src/count-to.js

@@ -6,7 +6,7 @@ var countTo = angular.module('countTo', [])
             link: function (scope, element, attrs) {
 
                 var e = element[0];
-                var num, refreshInterval, duration, steps, step, countTo, value, increment;
+                var num, refreshInterval, duration, steps, step, countTo, value, increment, format;
 
                 var calculate = function () {
                     refreshInterval = 30;
@@ -19,18 +19,22 @@ var countTo = angular.module('countTo', [])
                     steps = Math.ceil(duration / refreshInterval);
                     increment = ((countTo - scope.value) / steps);
                     num = scope.value;
+                    format = attrs.format=="comma"?function(number){
+                        return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+                    }:function(number){ return number};
                 }
 
+
                 var tick = function () {
                     scope.timoutId = $timeout(function () {
                         num += increment;
                         step++;
                         if (step >= steps) {
                             $timeout.cancel(scope.timoutId);
                             num = countTo;
-                            e.textContent = countTo;
+                            e.textContent = format(countTo);
                         } else {
-                            e.textContent = Math.round(num);
+                            e.textContent = format(Math.round(num));
                             tick();
                         }
                     }, refreshInterval);