$ionicView events not firing

Hi,
I have a problem that $ionicView events like $ionicView.enter, $ionicView.beforeEnter, $ionicView.leave… not firing.

This is my code in controller:
$scope.$on(’$ionicView.enter’, function() {
alert(“Controller entered”);
});

The thing is, this will only fire if i put this in my main controller, in any other controller events wont fire at all.
When i put $rootScope instead of $scope, it fires on every single view.
I am using RC 1.0, i’ve tried to update to latest nightly build, and this bug still occurs.
How to trigger $ionicView events from nested views or tabs ? For now, only works on main controller.

Hey @Whippin

Try using this code, I just added this function to our app and it’s working good.

Controller:

    $scope.$on( "$ionicView.enter", function( scopes, states ) {
        if( states.fromCache && states.stateName == "your view" ) {
            // do whatever
        }
    });

We are using caching and needed to do some calls on view enter.

1 Like

Hi,

I am having the same problem, the .beforeLeave, .leave and .afterLeave events are not firing. The events I’ve notice that are firing are:

when entering the view (in order):

$ionicView.loaded
$ionicView.beforeEnter
$ionicView.afterEnter
$ionicView.enter

when exiting the view:

$stateChangeStart

Setting the view to cache-view=“false”, the results for entering the view are the same and they change when exiting:

$stateChangeStart
$ionicView.unloaded
$ionicView.destroy

I’am needing to do something when leaving the view (and would like to leave it in cache) and I 'am quite stuck now. I have google this a lot, but didn’t find any solution. Does anybody have a solution for this?

Greetings

I was having similar problems with my project, none of the $ionicView events were firing on any of my controllers except one. After quite a lot of digging, I managed to figure out that the problem was where I was attaching my controller in the template. In order to receive the events, your controller must be set on the ion-view element.

3 Likes

Are you guys not using UI Router?

I have this same problem. My controllers are on ion -view elements.

I had a similar issue, pay attention if you are using in UI router the syntax “controller as” events will not be received by the $scope.

I have rather a unusual situation, My code works great in android. But does not work on iOS. My ionic platform ready event is firing correctly, but none of the ionic view events are firing in ios. Any pointers @mhartington ?

Below is how the code looks.

$scope.$on("$ionicView.loaded", function(event) {
            activate(); shell.getLocation();
})
2 Likes

Seems to be working for me. Maybe you could post a more in depth example?

Thanks for the quick reply…looks like my splash screen is not going hiding in iOS, but the same code works in android. I am not sure whats going wrong with it, i will look around in xcode or try disabling splash plugin

I had the same problem, using this post helped me out:

Essentially you need to use $scope.$parent.$on instead.

6 Likes

Solved my problem. Thank you!

Are there any news on this?

I was refactoring my application to respect the johnpapa angular styleguide, aswell I was moving all my controllers/templates in directives to prepare the application for angular2.

so in my router I only put a template: <directive></directive>

inside the directive I use the controllerAs syntax.

Using the parent scope didn’t change the behavior.

The ionicView events only fire the second time I access the route, does anybody has the same setup and ideas to resolve this problem?

Thanks.

This worked for me.

It took me a while to get it to work. I tried reload:true and some state redirections but found this to be the neatest solution.

controller

    $scope.$on("$ionicView.enter", function () {
      $scope.guests.length = 0;
    });

router

  .state('menu.import', {
    url: '/import',
    views: {
      'side-menu22': {
        templateUrl: 'js/import/import-form/import-form.html',
        controller: 'importCtrl',
        controllerAs: 'importCtrl',
      }
    },
    ....
  })

I try to make $ionicPopup appears before user existing a view, but $ionicView.leave or similar are not firing. I have $ionicView.loaded and $ionicView.beforeEnter, and they are working great.

I tried to use $ionicPlatform.(“pause”, func());

but I read somewhere, it will pause anything within the app, e.g $ionicPopup as well.

Also I have used $stateChangeStart and ionicView.unloaded, both are working but they are not what I need. Because both are firing after I exist my current view.

Is there anything that I can use to work around this?

looks like a dependeny issue.

I have the same issue, in ionic 1.3.2, I use the components.

But using $ionicParentView.enter worked.

I have the same issue with ionic 1.3.2.

Is it still good pratices to use this syntax in a controller ?

$scope.$on('$ionicView.afterEnter', function () {
                ...
});

The issue when using $scope.$parent.$on is that it’s fired on every view of the app. Any idea to prevent this ?
Thanks

1 Like

I know this is quite old, however i wanted to add that on Ionic v1.3.4 (the last version) the $ionicView.beforeEnter && $ionicView.afterEnter all work. But I don’t ever recall having issues on any version of 1.3.x.

That being said, I came to this thread because I am updating an older ionic v1 app and ran into a problem where the $ionicView.beforeEnter was not firing and I could not figure out why. It turns out the template that goes with that controller was missing closing HTML tags on a few <i class="icon> elements…I didn’t add the closing </i>

Thus, apparently, an element with a missing closing tag was preventing the controller $ionicView.beforeEnter/afterEnter functions from firing. I had NEVER seen that before so it took me a while to figure out the issue was in my template and not in my controller.

For what its worth, hope my discovery helps those in the future.