diff --git a/core/src/components/nav/nav.tsx b/core/src/components/nav/nav.tsx
index 7bedccf67f..b75fceae01 100644
--- a/core/src/components/nav/nav.tsx
+++ b/core/src/components/nav/nav.tsx
@@ -872,14 +872,15 @@ export class Nav implements NavOutlet {
       mode,
       showGoBack: this.canGoBackSync(enteringView),
       baseEl: this.el,
-      animationBuilder: this.animation || opts.animationBuilder || config.get('navAnimation'),
       progressCallback,
       animated: this.animated && config.getBoolean('animated', true),
 
       enteringEl,
       leavingEl,
 
-      ...opts
+      ...opts,
+
+      animationBuilder: opts.animationBuilder || this.animation || config.get('navAnimation')
     };
     const { hasCompleted } = await transition(animationOpts);
     return this.transitionFinish(hasCompleted, enteringView, leavingView, opts);
diff --git a/core/src/components/router-outlet/route-outlet.tsx b/core/src/components/router-outlet/route-outlet.tsx
index fe81399802..5e8e036e51 100644
--- a/core/src/components/router-outlet/route-outlet.tsx
+++ b/core/src/components/router-outlet/route-outlet.tsx
@@ -188,7 +188,7 @@ export class RouterOutlet implements ComponentInterface, NavOutlet {
 
     const { el, mode } = this;
     const animated = this.animated && config.getBoolean('animated', true);
-    const animationBuilder = this.animation || opts.animationBuilder || config.get('navAnimation');
+    const animationBuilder = opts.animationBuilder || this.animation || config.get('navAnimation');
 
     await transition({
       mode,