AngularJs & Ionic : Stop/Restart $timeout when change and return to view

Question

I have a View that is updated after 1 minute, I stop the timer after before leaving this view, and all is OK. After returning to the current view the timer don't restart again.

This is the code of the controller of this view:

.controller('IndexCtrl', function($scope, $timeout, RestService) {
    var updateN = 60*1000;
    $scope.test = "View 1 - Update";
    var update = function update() {
         timer = $timeout(update, updateN);
         /** make a http call to Rest API service and get data **/
        RestService.getdata(function(data) {;
             $scope.items = data.slice(0,2);
         });
    }();

   /** Stop the timer before leave the view**/
    $scope.$on('$ionicView.beforeLeave', function(){
   $timeout.cancel(timer);
      //alert("Before Leave");
   });  

   /** Restart timer **/
    $scope.$on('$ionicView.enter', function(){
    $timeout(update, updateN);
      //alert("Enter");
   }); 
})

.controller('ViewCtrl2', function($scope) {

  $scope.test = "View 2";

});

score 4 · Accepted Answer · answered Oct 01 '15 at 14:32

I resolve the problem, There is not a problem with the cache, but with the function update that is not called after I re-enter on the page. I move the update function inside the $ionicView.enter : The corrected code is:

   $scope.$on('$ionicView.beforeLeave', function(){
      //updateN=12000000;
      $timeout.cancel(timer);
      //alert("Leave");
   });

  $scope.$on('$ionicView.enter', function(){
      //updateN=12000000;
    var update = function update() {
    timer = $timeout(update, updateN);
    RestService.getdata(function(data) {
        //console.log(tani);
        //$scope.items = data;
        $scope.items = data.slice(0,2);
    });
   }();
   });

That was the problem. You can always use the angular service [$interval](https://docs.angularjs.org/api/ng/service/$interval). — LeftyX, Oct 02 '15 at 11:09

score 0 · Answer 2 · answered Oct 01 '15 at 11:46

0

When you go back to current view, it comes from the cache, so the controller does not work again. You can disable caching in the config section of your app by adding this line of code :

$ionicConfigProvider.views.maxCache(0);

or you can disable cache on a specific view in the routing part by addding cache : false property.

More information here and here

answered Oct 01 '15 at 11:46

Emre

159
11

I already have set cache false to the current view: On the Index template I have set : ........ – ingalb Oct 01 '15 at 13:43
Did you try the .config version of disabling cache? – Emre Oct 01 '15 at 13:58

score -1 · Answer 3 · answered Oct 06 '15 at 19:17

In your code your controller function does not call on change of view. call $timeout function outside of var update function. Each time view loads it call its controller and call anonymous or self executing functions in their scope.

.controller('IndexCtrl', function($scope, $timeout, RestService) {
var updateN = 60 * 1000;
$scope.test = "View 1 - Update";
var update = function update() {
    var timer = $timeout(update, updateN);
    /** make a http call to Rest API service and get data **/
    RestService.getdata(function(data) {;
        $scope.items = data.slice(0, 2);
    });
}();

/** Stop the timer before leave the view**/
$scope.$on('$ionicView.beforeLeave', function() {
    $timeout.cancel(timer);
    //alert("Before Leave");
});

/** Restart timer **/
$scope.$on('$ionicView.enter', function() {

    timer()
});

})

.controller('ViewCtrl2', function($scope) {

$scope.test = "View 2";

});

AngularJs & Ionic : Stop/Restart $timeout when change and return to view

3 Answers3