Angular pass a component from a module to another module in the App module

Question

I have an issue figuring out how I can pass a component from a module I import into my Angular application and use it inside another module that I import also in my App.

Note that all those two modules are modules I created.

That's my app.module.ts :

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    PnDashboardComponent,
    PnFormulaireComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    LayoutModule.forRoot(environment.layout),
    DispoModule.forRoot(environment.dispoAides)
  ],
  providers: [
    ErrorsHandler,
    InitialisationService,
    InitializationGuard
  ],
  bootstrap: [AppComponent]
})

What I want to do is pass a component let's say called BreadcrumbComponent from the LayoutModule to the DispoModule and beeing able to use it inside that module.

Note that LayoutModule and DispoModule are dependent angular module project that are packaged with ng-packagr and imported in my Application.

Thank you.

Answer 1

You need to create a SharedModule and declare the BreadcrumbComponent in it. Also export the component so that i can be used across other Modules.

Import the SharedModule wherever you want to use BreadcrumbComponent in the application

Answer 2

If you want to do is pass a component let's say called BreadcrumbComponent from the LayoutModule to the DispoModule and beeing able to use it inside that module.

then write

exports: [
    BreadcrumbComponent
]

in your LayoutModule

and import LayoutModule in DispoModule