Make Common Modules for Lazy loaded modules

Question

What I need to know is that how can I define modules common Or we can say global for whole application that are used by all other children modules. Here If i use lazy loading , I have to write all the dependencies again to all my child modules . how can I avoid that and only define it in app.module.ts file.

Let's say I want to use Toaster In all children modules. I have to include ToasterModule into all child Modules.

How can I avoid this and only include it in main module and user it in all child modules ?

Hitesh Kansagara Hitesh Kansagara · Accepted Answer · 2018-03-29T20:34:04

you have to import Toaster module in app module and also exports it in app module then you can use it every where

@NgModule({
  imports: [     
    ToasterModule       
  ],
  declarations: [      
  ],
  exports:[
    ToasterModule
  ],
  providers: [ ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

and you can also make common module and export it like

@NgModule({
      imports: [     
        ToasterModule,
        ----        
      ]     

    })
    export class CommonModule { }

and import and export it into app module

@NgModule({
      imports: [     
        CommonModule        
      ],
      exports:[
        CommonModule
      ],
      providers: [ ],
      bootstrap: [ AppComponent ]
    })
    export class AppModule { }

Make Common Modules for Lazy loaded modules

1 Answers