Modules to an Angular Project

  • main.ts file loads the first Module in Angular, by default AppModule is loaded

  • app.module file looks like below
  • There are 2 imports here
    • BrowserModule – This allows the module to run on a browser
    • NgModule
      • All the files in Angular are classes
      • So how would Angular know why class to pick as a module,component or a service
      • We do this by puttting a decorator above the class
      • NgModule decorator tells Angular that this class can be treated as a Module
    • NgModule has an Object passed into it and this object has 4 properties
      • declarations
        • All the components inside a module is declared in this property as an array
      • imports
        • Other modules used in this module are listed in imports section as array
      • providers
        • All the services are mentioned in providers section
      • bootstrap
        • The component that has to be booted first when this component is called is mentioned in bootstrap section.

  • Create a new Angular module using below CLI command
ng new ModulesDemo --dry-run
ng new ModulesDemo

Reference :

Leave a Comment