No commas, formatting display

[chrislewispac]

The current version does not add commas so I added a regex to display commas.

var countTo = angular.module('countTo', [])
.directive('countTo', ['$timeout', function ($timeout) {
    return {
        replace: false,
        scope: true,
        link: function (scope, element, attrs) {

            var e = element[0];
            var num, refreshInterval, duration, steps, step, countTo, value, increment;

            var calculate = function () {
                refreshInterval = 30;
                step = 0;
                scope.timoutId = null;
                countTo = parseInt(attrs.countTo) || 0;
                scope.value = parseInt(attrs.value, 10) || 0;
                duration = (parseFloat(attrs.duration) * 1000) || 0;

                steps = Math.ceil(duration / refreshInterval);
                increment = ((countTo - scope.value) / steps);
                num = scope.value;
            }

            var tick = function () {

                function numberWithCommas(x) {
                    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                }
                scope.timoutId = $timeout(function () {
                    num += increment;
                    step++;
                    if (step >= steps) {
                        $timeout.cancel(scope.timoutId);
                        num = countTo;
                        e.textContent = numberWithCommas(countTo);
                    } else {
                        var Content = Math.round(num);
                        tick();
                        e.textContent = numberWithCommas(Content);
                    }
                }, refreshInterval);

            }

            var start = function () {
                if (scope.timoutId) {
                    $timeout.cancel(scope.timoutId);
                }
                calculate();
                tick();
            }

            attrs.$observe('countTo', function (val) {
                if (val) {
                    start();
                }
            });

            attrs.$observe('value', function (val) {
                start();
            });

            return true;
        }
    }

}]);

[krutkowski86]

Better solution is to use angular $filter
e.textContent = $filter('number')(countTo,fractionSize);

[brentchow]

Try out this fork: https://github.com/pfitzpaddy/angular-filter-count-to

[Xyroid]

@brentchow Please bump the AngularJS version. I am getting error ECONFLICT Unable to find suitable version for angular while installing from bower. I need to use AngularJS v1.5.8