I would like to combine several components into a module ( Widget1Module), and then insert this module into another module ( AdminModule), giving all components AdminModuleaccess to the components in Widget1Module.
I want to do this in order to avoid an array declarationsin AdminModulefrom growing large and unmanaged, see below for a more detailed explanation of my problem.
I have a module file, for example:
import { CommonModule } from '@angular/common';
import { RoutingModule } from './admin-routing.module';
import { Declaration1 } from "./declaration1.component";
import { Declaration2 } from "./declaration2.component";
import { Declaration3 } from "./declaration3.component";
@NgModule({
imports: [
CommonModule,
RoutingModule,
],
declarations: [
Declaration1,
Declaration2,
Declaration3,
]
})
export class AdminModule {}
I would like to create a component ( Widget1Component) that can be used inside any of the 'declaration' modules. I know I can do something like this:
import { CommonModule } from '@angular/common';
import { RoutingModule } from './admin-routing.module';
import { Declaration1 } from "./declaration1.component";
import { Declaration2 } from "./declaration2.component";
import { Declaration3 } from "./declaration3.component";
import { Widget1 } from "./widget1.component";
@NgModule({
imports: [
CommonModule,
RoutingModule,
],
declarations: [
Declaration1,
Declaration2,
Declaration3,
Widget1
]
})
export class AdminModule {}
, , , , , :
import { CommonModule } from '@angular/common';
import { RoutingModule } from './admin-routing.module';
import { Declaration1 } from "./declaration1.component";
import { Declaration2 } from "./declaration2.component";
import { Declaration3 } from "./declaration3.component";
import { Widget1Module } from "./widget1.module";
@NgModule({
imports: [
CommonModule,
RoutingModule,
Widget1Module
],
declarations: [
Declaration1,
Declaration2,
Declaration3
]
})
export class AdminModule {}
, - , , , Widget1Module.