ANGULAR Components

Components is a class that has programming logic for html page.In dotnet point,we can say it as code behind.
Components are identified using @component decorator.
It has 3 main blocks
Class
Class which contains properties and methods for View
Template
it contains HTML file or template to render view in browser
Metadata
Inside the component we see the object like templateurl,selector,styleurls
that object is called as METADATA.
Every component should have template.
Tagname: By using this tagname we are going to invoke this component.

Let us understand the creation of component in Angular by a simple example.

Step 1:Create a new project by issuing following command "ng new CreateComponent" in Angular CLI.

Step 2:It creates four files.

• app.component.html
• app.component.ts
• app.component.spec.ts
• app.component.css

Step 3:Let us modify app.component.html by deleting the exising code and give message as "Welcome to USMTECHWORLD SITE"

Welcome to {{title}}
<router-outlet><router-outlet>

Step 4: Now run and see the output:-