How to disable page transition animation in Ionic 4 / Angular?

Ionic Framework
1

Hey guys,

I’m using ‘routerLink’ to navigate to a new page and I was wondering how I could disable the page transition animation? I couldn’t find an answer to that simple question in the documentation or here, could someone please point me to the right spot? :hugs:

Many thanks!
Jil

1 Like
2

I found the solution:

IonicModule.forRoot({animated: false});

has to be within imports in app.module.ts, e.g.

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot({animated: false}), AppRoutingModule],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
1 Like
3

IonicModule.forRoot({animated: false}); disable all the animations on ionic app such as toasts and skeletons, how to disable only the page transition animation?

6 Likes
4

In your app component add “animated=‘false’”

Like this :

disabled only transition

5

Just try this solution for ionic 5 and it works incase some one want to look at it.