🐞 bug report

Affected Package

Description

For some reason CanDeactivate guard gets called with an incorrect component instance.
In this case it should get called with a component that is mounted in a named outlet, but gets called with one from primary outlet. See example in stackblitz.

I'd expect that with configuration like below:

The guard should only be called when AdminHeaderComponent is being deactivated and only with this component instance.

One notable thing is that the currentRoute param is correct!

EDIT: found a workaround:

canDeactivate(component: HasComponentPendingChanges, currentRoute: ActivatedRouteSnapshot, currentState: RouterStateSnapshot) {
    if (currentRoute.outlet === OVERLAY_OUTLET && this.router['rootContexts'] && this.router['rootContexts'].getContext) {
        const context: OutletContext = this.router['rootContexts'].getContext(OVERLAY_OUTLET);
        if (context && context.outlet && context.outlet.isActivated && context.outlet['activated'].instance) {
            component = context.outlet['activated'].instance;
        }
    }

🔬 Minimal Reproduction

https://stackblitz.com/edit/angular-named-outlet-yfgsip?file=app%2Fadmin%2Fadmin.module.ts

• Open the link
• Open the console
• Click on admin link
• Click on create user link
• Observe that following message is printed:

deactivating UsersListComponent {}

• Now click on hide navbar link
  

• Observe that following messages are printed:

deactivating CreateUserComponent {}
deactivating AdminHeaderComponent {}

^ all good

• Now the fun begins, click on admin and create user links again
• Click on Component 2
• Observe that following messages are printed:

deactivating UsersListComponent {}
deactivating CreateUserComponent {}
deactivating CreateUserComponent {}

I'd argue that the last message should state AdminHeaderComponent

🌍 Your Environment

Angular Version:

8.2.14