AngularJS 4 Tutorial: 05. Generating components using Angular CLI

In this video we will discuss generating components using Angular CLI.

To generate a component use the following command
"ng generate component" Component Name

OR the shortcut as shown below

ng g c Component Name

When we execute this command (ng g c abc) , several things happen
1. A folder with name abc is created
2. The component files (Component class, View template, CSS file and the spec file ) are created and placed inside the folder "abc"
3. The root module file (app.module.ts) is also updated with our new component i.e the required import statement to import the abc component from the component file is included and the component is also declared in the declarations array of the @NgModule()

Placing the generated component folder in a different folder : If you want the newly created folder to be placed in a different folder other than the app folder, simply include the folder name in the ng generate command

Generating a new component without a folder : use --flat option with the ng generate command

Using --dry-run flag with component generation :
The --dry-run flag reports the files and folders that will be generated, without actually generating them. Once you are happy with what it is going to generate, you can remove the --dry-run flag and execute the command.

If you want an inline template and styles instead of an external template and style sheet, use -it flag for inline template and -is flag for inline styles. Along the same lines, if you do not want a spec file use --spec=false.

Click Subscribe for More Videos