The initial situation is as follows: in the node_moduls folder of my project there is a module named @example with some components that I want to use in the application. The number of components varies, so you need to dynamically indicate which components are included in the module. The example.module.ts file looks like this:
import { NgModule } from '@angular/core'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; import { FirstModule } from 'EXAMPLE_PATH'; import { SecondModule } from 'EXAMPLE_PATH'; import { ThirdModule } from 'EXAMPLE_PATH'; import { FourthModule } from 'EXAMPLE_PATH'; const MODULES = [ FirstModule, SecondModule, ThirdModule, FourthModule ]; @NgModule({ imports: [NgbModule.forRoot(), ...MODULES], exports: [NgbModule, ...MODULES], providers: [ExampleService] }) export class ExampleModule { }
The MODULES array contains all the components that are included. Typically, a module is imported into the application with the following app.module.ts
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { ExampleModule } from '@example/example-module'; import { AppComponent } from './app.component'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, ExampleModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { }
Is it possible to somehow determine inside the application which export components of exampleModule or, rather, the application imports from this module?
Therefore, at the end of this example, the application should know that FirstModule , SecondModule , ThirdModule and FourthModule imported and can be used.
source share