Create Angular Components

 

Components are the main building block for Angular applications. Each component consists of:-

•  An HTML template that declares what renders on the page
• A Typescript class that defines behavior
• A CSS selector that defines how the component is used in a template
• Optionally, CSS styles applied to the template 

Creating a component:

        The easiest way to create a component is with the Angular CLI. You can also create a component manually.

Creating a component using the Angular CLI

    To create a component using the Angular CLI.

• From a terminal window, navigate to the directory containing your application.
• Run the ng generate component <component-name> command, where <component-name> is the name of your new component.

Example:-

If you want to create Home component then open cli and write below command to create Home Component.

  ng generate component Home (OR)  ng g g Home

Component Contains

1. A folder named after the component
2. A component file, <component-name>.component.ts
3. A template file, <component-name>.component.html
4. A CSS file, <component-name>.component.css
5. A testing specification file, <component-name>.component.spec.ts