Skip to content

bug(router) 'Cannot activate an already activated outlet' error when using aux routes in lazy loaded module #41481

@JohnKis

Description

@JohnKis

🐞 bug report

Affected Package

The issue is caused by package @angular/router

Is this a regression?

No

Description

Router throws Cannot activate an already activated outlet error when using aux routes in a lazy loaded module.

🔬 Minimal Reproduction

https://stackblitz.com/edit/angular-ivy-im6uaf?file=src%2Fapp%2Fmain%2Fmain-routing.module.ts

  • Click on Main 1 link
  • Click on the Aux 1 link
  • Click on the Aux 2 link
  • Observe the error

Interestingly, if using routerLink instead of router.navigate() then the error is different. Might be related.

The same setup works perfectly when used in AppModule: https://stackblitz.com/edit/angular-ivy-n5qxgu?file=src%2Fapp%2Fapp-routing.module.ts

🔥 Exception or Error

ERROR
Error: Uncaught (in promise): Error: Cannot activate an already activated outlet
Error: Cannot activate an already activated outlet
at RouterOutlet.activateWith (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:5884:23)
at ActivateRoutes.activateRoutes (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:2585:44)
at eval (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:2536:23)
at Array.forEach ()
at ActivateRoutes.activateChildRoutes (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:2535:33)
at ActivateRoutes.activateRoutes (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:2552:26)
at eval (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:2536:23)
at Array.forEach ()
at ActivateRoutes.activateChildRoutes (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:2535:33)
at ActivateRoutes.activateRoutes (https://angular-ivy-im6uaf.stackblitz.io/turbo_modules/@angular/[email protected]/__ivy_ngcc__/bundles/router.umd.js:2556:26)

🌍 Your Environment

Angular Version:


     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 11.2.7
Node: 14.15.4
OS: darwin x64

Angular: 11.2.8
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1102.7
@angular-devkit/build-angular   0.1102.7
@angular-devkit/core            11.2.7
@angular-devkit/schematics      11.2.7
@angular/cdk                    11.2.7
@angular/cli                    11.2.7
@angular/material               11.2.7
@schematics/angular             11.2.7
@schematics/update              0.1102.7
rxjs                            6.6.7
typescript                      4.0.2

Anything else relevant?

Metadata

Metadata

Assignees

Labels

P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: routerrouter: aux routesrouter: directivesRouterLink, RouterLinkActive, RouterOutlet etc.

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions