Skip to content

Issue with assigning lazy loaded standalone components environment injectors #50724

@AleksanderBodurri

Description

@AleksanderBodurri

Which @angular/* package(s) are the source of the bug?

core/router

Is this a regression?

No

Description

Noticed some odd DI/Router behaviour,

I have 2 lazily loaded standalone components, each loading from different routes, each importing an NgModule that provides a service.

Source here https://stackblitz.com/edit/angular-n7t8rb, you may have to visit this first to get the links below working.

If I visit https://angular-n7t8rb.stackblitz.io/ and then click the “lazy two” button, I get a DI error.
If i visit https://angular-n7t8rb.stackblitz.io/two it loads successfully. Why would this work when the router-based navigation above did not? When i click the “lazy one” button to load the other lazy component, theres a DI error.

I’ve logged the injectors created by each component as they render, it looks like the first Lazy component that gets loaded is the one that gets a new Environment Injector, the second does not, causing the DI error. We get an R3 injector for App and 1 for either LazyComponent or LazyTwoComponent, based on which loads first. I think this is related to the usage of loadComponent

I made another example with loadChildren for one route and loadComponent for the second, https://stackblitz.com/edit/angular-3ffdoh. In this case we get no errors and an R3 injector for App, LazyComponent and LazyTwoComponent, which seems to me like the expected behavior.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions