Support us .Net Basics C# SQL ASP.NET Aarvi MVC Slides C# Programs Subscribe Download

Angular cli generate module

Suggested Videos
Part 8 - Angular CLI project structure - 2 | Text | Slides
Part 9 - Angular cli generate component | Text | Slides
Part 10 - Angular cli generate service | Text | Slides

In this video we will discuss generating modules using the Angular CLI. 

To generate a module use
ng generate module moduleName OR ng g m moduleName

For example to generate a students module we could use 
ng generate module students -d OR ng g m students -d

Please note : Since we are using the --dry-run flag, the module file and folder is not actually created. We only get the report of the files and folders that will be created.

The above command generates the students module inside students folder. Remember for us to be able to use this newly generated module, we must import it in the root module.

We can do it manually after creating the module or we can tell Angular CLI to import our newly generated module into the root module using --module option. We can also use it's alias -m

The following command not only generates students module, it also imports it into the root module (AppModule)
ng g m students -d -m=app.module

By default a spec file is not generated. If you also want a spec file to be generated use the --spec option
ng g m students -d -m=app.module --spec=true

When generating a module, Angular CLI by default creates a folder for the module and places the module files in that folder. If you do not want a dedicated folder for the module you are generating, use --flat option.
ng g m students -d -m=app.module --spec=true --flat=true

Unitil now, we have been using the --dry-run option. Now let's remove the -d option and execute the command so the module is actually created.
ng g m students -m=app.module --spec=true --flat=true

The above command not only creates the students module, it also imports it into the root module (AppModule). If we look inside app.module.ts file, notice
  1. The required import statement to import students module is included
  2. The students module is also included in the "imports" array
angular cli tutorial for beginners

No comments:

Post a Comment

It would be great if you can help share these free resources