Lazy loading non-routing modules with bootstrap modals implementation

This code was created Based on https://netbasal.com/the-need-for-speed-lazy-load-non-routable-modules-in-angular-30c8f1c33093 but updated to a newer angular version.

Hello, I want to tell you how you can slim down your main build. If you have a lot of modals with few components inside what was required to use only inside this modal for instance many steps forms like in mine project.

At first, we should create a new module with a directive that will be loading our modules, interface what is required for components that will be using our directive, and mapper with a list of our modules to load.

In the module, we need only import and export our directive

import { NgModule } from '@angular/core';
import { LoadModuleDirective } from './load-module.directive'; 
@NgModule({
    declarations: [LoadModuleDirective],
    exports: [LoadModuleDirective],
})
export class LazyLoadModule {}

In the interface we are creating methods what are we need to implement into containers which will be using our directive, input is an unknown object because we don’t what we will be binding into modals — there can be many of them with different data.

import { EventEmitter } from…