Search code examples
angularionic-frameworkangular2-routingionic6

Choosing router transition in Angular Ionic 6


I'm using Ionic 6 with Angular and sometimes Ionic includes some nice animation when transitioning between routes. Can I choose which animation will be used when I navigate using route.navigate(['path'])? Is it possible to choose it from the default Ionic animations?


Solution

  • Ionic provides default animations for both iOS & Android.

    Instead of using route.navigate(['path']), You can use NavController methods. Basically, it uses Angular's router with explicit direction. Ionic will animate this transition for you.

    // imports
    import { NavController } from "@ionic/angular";
    
    constructor(
      private navCtrl: NavController,
    ){ }
    
    // example usage with forward route
    this.navCtrl.navigateForward(['path']);