Nav-view="leaving" never fires


#1

I have a nested view, and when I use the back button to go to the previous page, which is a ng-repeat, I receive a black screen on the right side of the page briefly.

I noticed that the nested view never receives the nav-view=“leaving” attribute, it goes straight from active to cached.

Any idea why this view doesn’t fire nav-view=“leaving”?

Thanks!

#transitions #nav-view #back-button #ionicHistory


#2

I have found that this animation problem is caused when navigating back to a page that has an ng-repeat, remove the ng-repeat and the problem is gone…


#3

Investigating further, the problem persists with an ng-repeat that has dynamic data added.

For example

ng-repeat=“room in rooms”

  1. I add a room to the list

  2. then I click that room to see it’s details.

  3. When I click back, I see the jump


#4

Hi @traviss,

Thanks for posting. For the ng-repeat thing, can you create a small codepen or something so I can see/recreate the issue? I have not seen that one before.

I am not clear on what you mean by the following.

Any idea why this view doesn't fire nav-view="leaving"

Do you mean that the view in question is not receiving the following event?

$scope.$on('$ionicView.leave', function(){
   // received the leave event
});

#5

In the DOM, for each ion-view, there’s a nav-view="cached, leaving, entering, active etc… based on the transition and navigation of pages

and from what I see in the CSS, these attributes correspond to styles for the ion-views

In any case, when I hit the back button on the page to navigate back to my dynamic ng-repeat list, this top view is instantly cached (nav-view=“cached”), as opposed to using the ‘leaving’ styles first, which I believe causes the black screen jump because when the view is cached it receives display none, opacity 0, and a lower z-index

I have actually written a complete hack that mimics Ionic’s back animation and I’m doing it myself, and once my custom animation is done, I fire $ionicHistory.back() with no transition.

I’m happy with the hack, but I’d love to just get the bug fixed and use the back button as normal :slight_smile:


#6

Hi @traviss,

I’m glad you were able to work around the issue! If you can create a codepen showing your issue, we can look into getting it fixed. We’re happy to help.

Thanks,
Dan