angular timer directive not working with ionic framework

Question

I am having issues with implementing the angular timer directive with the ionic framework. http://siddii.github.io/angular-timer/

When I implement the code using bow

Answer 1

as per the discussion in comments, I am sharing the implementation of basic directive that I am using. This is not as generic as angular-timer, so you might need to tweak the little to suit your need.

first part : factory to hold the timer, start/stop, etc etc

csapp.factory("timerfactory", function () {
    var refresh = {
        suspend: false,
        pause: function () { refresh.suspend = true; },
        cont: function () { refresh.suspend = false; },
        toggle: function () { refresh.suspend = !refresh.suspend; },
        refreshText: function () { return refresh.suspend ? "Resume Refresh" : "Pause Refresh"; }
    };

    var timer = {
        timePending: 0,
        refreshInterval: 60,
        reset: function () { timer.timePending = timer.refreshInterval; },
        update: function () {
            if (timer.timePending < 0) timer.reset();
            timer.timePending--;
        },
        done: function () { return timer.timePending <= 0; },
        force: function () { timer.timePending = 0; }
    };

    return {
        refresh: refresh,
        timer: timer
    };
});

second part : the directive, which supports 2 operations

1. boolean pause variable with 2 way binding

2. on-timeout function : which will be called on timeout

3. interval : in seconds, after which the on-timeout function would be called

   csapp.directive("csAutoRefresh", ["timerfactory", "Logger", "$interval", function (factory, logManager, $interval) {

   var $log = logManager.getInstance('csAutoRefresh');
   
   var templateFn = function () {
       var template = '
    0) {
           scope.factory.timer.refreshInterval = scope.interval;
       }
       factory.timer.reset();
   
       scope.$watch(function () {
           return factory.timer.timePending;
       }, function () {
           if (!factory.timer.done()) return;
           var result = scope.$eval(scope.onTimeout);
           if (angular.isObject(result) && angular.isFunction(result.then)) {
               scope.isprocessing = false;
               factory.timer.reset();
               result.finally(function () {
                   factory.timer.reset();
               });
           };
       });
   
       scope.$watch('pauseOn', function () {
           if (scope.pauseOn) {
               factory.refresh.pause();
           } else {
               factory.timer.reset();
               factory.refresh.cont();
           }
       });
   
       var updateTimer = function () {
           if (scope.isprocessing) return;
           if (factory.refresh.suspend) return;
           factory.timer.update();
       };
   
       var interval = $interval(updateTimer, 1000);
       scope.$on('$destroy', function () {
           $interval.cancel(interval);
       });
   };
   
   return {
       restrict: 'E',
       scope: { onTimeout: '&', pauseOn: '=', interval: '@' },
       template: templateFn,
       link: linkFn,
    };
   }]);