Angular / Ionic - controller only runs once

Question

I'm starting out with Angular through the Ionic Framework but I am failing to understand why the controller only runs once i.e. I change state, the controller runs, change to another state and then back again and the controller does not run a second time. This is my state:

$stateProvider.state( 'container.previous', {
    url: 'previous',
    views: {
        main : {
            templateUrl : 'views/previous.html',
            controller : function( $scope, $cordovaSQLite ){
                $scope.firms = [];
                $cordovaSQLite.execute(window.db, "SELECT * FROM recent GROUP BY phone ORDER by id DESC").then(function(res) {
                    for (i = 0; i < res.rows.length; i++) {
                        $scope.firms.push(res.rows.item(i));
                    }
                }, function (err) {
                    console.error(err);
                });
            }
        }
    },
    onStateChangeStart : function(){
        backButton = true;

    }
});

In another state, if you click on a button related to a "firm", it saves the "firms" data to local storage. The above state shows the firms in which you have previously clicked on. But I cannot figure out how to update the $scope.firms correctly as the controller never runs again.

Can anyone help me out?

Brandy Carney · Accepted Answer · 2019-02-15T20:35:11.990

22

You can put the code you want to run in $ionicView.enter:

controller : function( $scope, $cordovaSQLite ){
    $scope.$on('$ionicView.enter', function() {
        // code to run each time view is entered
    });

    ...
});

See "View LifeCycle and Events": https://ionicframework.com/docs/v1/api/directive/ionView/

edited Feb 15 '19 at 20:35

answered Mar 26 '15 at 19:07

Brandy Carney

1,186
10
21

score 5 · Answer 2 · answered Mar 07 '16 at 15:38

Building on @brandyshea's answer, I would like to add if you want to specify no caching in one area/controller/state, and take advantage of the caching in other areas, you can simply use the cache parameter in your $stateProvider for that state.

Disable cache within state provider

$stateProvider.state('myState', {
  cache: false,
  url : '/myUrl',
  templateUrl : 'my-template.html'
})

Alternatively, you can use one of the other methods too:

Disable cache with an attribute
<ion-view cache-view="false" view-title="My Title!">
...
</ion-view>
Disable cache globally The $ionicConfigProvider can be used to set the maximum allowable views which can be cached, but this can also be use to disable all caching by setting it to 0.
$ionicConfigProvider.views.maxCache(0);

References: http://ionicframework.com/docs/api/directive/ionNavView/ and http://ionicframework.com/docs/api/directive/ionView/

score 4 · Answer 3 · answered Mar 26 '15 at 10:25

4

You don't need to disable entire app cache. If you want to re-run controller every time you enter on it you should clear cache before you leave it:

 $scope.$on("$ionicView.afterLeave", function () {
         $ionicHistory.clearCache();
 });

answered Mar 26 '15 at 10:25

Pedro Justo

3,969
1
17
21

Quick question, this clears all the cache, can you clear the cache for that one state? – Luke Snowden Apr 27 '15 at 20:46
I think clear cache dinamically for only one state is not possible yet. you can configure your state to not be cached but that way that state will never be cached – Pedro Justo Apr 28 '15 at 11:33

score 2 · Answer 4 · answered Mar 26 '15 at 09:13

2

Ionic has a cache mechanism inside. You can disable caching globally in your config function like this :

$ionicConfigProvider.views.maxCache(0);

answered Mar 26 '15 at 09:13

Emre

159
11

score 2 · Answer 5 · answered Dec 16 '15 at 15:05

2

Put this in your ion-view.

<ion-view cache-view="false">

answered Dec 16 '15 at 15:05

Everton Castro

129
1
8

Angular / Ionic - controller only runs once

5 Answers5

Linked