Let's say I have a module with components and services which should only be loaded if a specific feature flag is true. The app.component checks for the feature flag and in its template has a component to render dynamically injected components. I can load the module conditionally: private async checkOnboardingStatus() { if ( true ) { const { OnboardingModule } = await import('./onboarding/onboarding.module'); const { OnbGuideService } = await import('./onboarding/services/onb-guide.service'); const moduleInjector = Injector.create({ parent: AppInjector.injector, providers: [{ provide: OnbGuideService, useClass: OnbGuideService }] }); /** * magic happens here * and we get an instance of OnboardingComponent **/ /** * DRC this is DynamicRendererComponent which expects this structure */ this.drc.data = {comp: OnboardingComponent, data: {}}; } } The whole point of this lazy loading is that the module will not be needed later in the lifecycle of the app and is only needed in the very beginning, maybe one more time with the next load. I just don't want to add it to 'shared' module and needlessly drag it around. Continue reading...
