Getting NaN when a directive is used in angularJs

Question

I am using a directive to show the number count effect for my dashboard when i used the directive for the h3 i am getting the result as NaN. when i remove the directive from the h3 i am getting the correct output. When i looked into the directive i can the the value is get from element which shows the value as NaN. can anyone tell me what is wrong in the code?

Output with directive:

<h3 animate-numbers="" class="ng-binding">NaN</h3>

Html:

<h3 animate-numbers>{{vm.dashboard.no_of_applications}}</h3>

Controller:

vm.dashboard = {
  no_of_users: 0,
  no_of_applications: 0,
  no_of_departments: 0,
  no_of_schemes: 0,
};

Directive:

'use strict';
angular.module('ss')
 .directive('animateNumbers', function ($timeout, $log) {
return {
replace: false,
scope: true,
link: function (scope, element) {
  var e = element[0];
  $log.log('e is', e);
  var refreshInterval = 30;
  var duration = 1000; //milliseconds
  var number = parseInt(e.innerText);
  var step = 0;
  var num = 0;
  var steps = Math.ceil(duration / refreshInterval);
  var increment = (number / steps);
  var percentCompleted = 0;
  var lastNumberSlowCount = 3;
  if (number > lastNumberSlowCount) {
    number = number - lastNumberSlowCount;
  }
  scope.timoutId = null;
  var slowCounter = function () {
    scope.timoutId = $timeout(function () {
      lastNumberSlowCount --;
      if (lastNumberSlowCount  < 0) {
        $timeout.cancel(scope.timoutId);
      } else {
        number++;
        e.textContent = number;
        slowCounter();
      }
    }, 500);
  };
  var counter = function () {
    scope.timoutId = $timeout(function () {
      num += increment;
      percentCompleted = Math.round((num / number) * 100);
      if (percentCompleted > 60 && percentCompleted < 80) {
        refreshInterval = refreshInterval + 10;
      } else if (percentCompleted > 90) {
        refreshInterval = 200;
      }
      step++;
      if (step >= steps) {
        $timeout.cancel(scope.timoutId);
        num = number;
        e.textContent = number;
        if (number > lastNumberSlowCount) {
          slowCounter();
        }
      } else {
        e.textContent = Math.round(num);
        counter();
      }
    }, refreshInterval);
  };
  counter();
  return true;
}
};
});