How to set page transition of navbar back button?

I can set the page transition by

this.nav.push(page1, {}, {animation: ‘ios-transition’});

but how do I set the page transition on back button pressed in the navbar?

If I do not set anything, the page gets stuck halfway.


as shown in latest docs

This would work if I was coding the back button, but the back button is automatically added to the navbar. I could disable the button and add my own and use pop but is there not a simpler option? Or where can I find the code for the back button?

1 Like

Hey - did you find a way out ?

Would like to know also, if you found the solution. Where do I access the code for the navbar back button’s animation?



It’s not working here either

  <ion-navbar hideBackButton="true">
    <button (click)="back()" ion-button icon-left clear small>
    <ion-icon name="arrow-back"></ion-icon>
    <div> Voltar</div>

public back = (url) => this.navCtrl.pop();

Still not working, it goes back roughly, without transitioning

1 Like

Hi all, i found these error (not working):

   animate: true,
   direction: 'back',
   animation: 'ios-transition',

this.navCtrl.push == animation WORKING
this.navCtrl.pop == animation NOT WORKING

Mário Pácio

Same problem here, please mario, come here in the issue page and post your error :

So this is not possible? I don’t want to add a custom back button just to change the transition type to md of some specific pages. Did someone find a solution?

Hi, imaatLuciano.

You have already try this way?

This Overriding back button method of the Navbar works well in my case.

1 Like

yes you can override the hardware back button but there is apparently no possible way to config the default behavior for going back via navBar. the only way would be to disable this godless button and program another one instead