Skip to main content

What is Component in angular

Components define views, which are sets of screen elements that angular can choose among and modify according to your program logic and data.
Component are simply classes, with decorator that mark their type and provide metadata that tells angular how to use them.

  • The metadata for a component class associates it with a template that defines a view. A template combines ordinary HTML with angular directives and bind markup that allow angular to modify the HTML before rendering it for display.
So in simple terms a component in Angular is composed of these 3 things
Template - Defines the user interface. Contains the HTML, directives and bindings.
Class - Contains the code required for template. Just like a class in any object oriented programming language like C# or Java, a class in angular can contain methods and properties. Properties contain the data that we want to display in the view template and methods contain the logic for the view. We use TypeScript to create the class.
Decorator - We use the Component decorator provided by Angular to add metadata to the class. A class becomes an Angular component, when it is decorated with the Component decorator.

Comments

Post a Comment

Popular posts from this blog

Default Parameters

Default Parameters A JavaScript function can have default parameter values. Using default function parameters, you can initialize formal parameters with default values. If you do not initialize a parameter with some value, then the default value of the parameter is undefined. Example 1 Without passing argument value function Hello(name) { console.log('Value Of Name parameter = ' + name ) } Hello(); Output Value Of Name parameter = undefined Example 2 passing argument value function Hello(name) { console.log('Value Of Name parameter = ' + name ) } Hello("Hello"); Output Value Of Name parameter = Hello Example 1 With Set Parameters Default vlaue // Add Name parameter default value is 'Hello World' check below function Hello( name='Hello World' ) { console.log('Value Of Name parameter = ' + name ) } // Calling without passing arguments show the default value Hello(); Output Value Of Name ...
Post a Comment
Read more

Es6 Topics

Es6 Topics Let, Const Arrow Function Default Parameter Values Rest Parameter Spread Operator Template Literals Classes Class Definition Class Inheritance Class Inheritance, From Expressions Base Class Access Static Members Getter/Setter
Post a Comment
Read more

Steps for install angular on your machine

Install Node Js from  https://nodejs.org/en/ .  after install node check installation is successful run command on CMD   node -v show the node version. Open Command Prompt Run as administrator and run command " npm install -g @angular/cli " when install angular cli shows some error and warning  ignore them.  After install the angular cli create the project in the C Drive when open command prompt run as administrator show the current path like this "C:\Windows\system32>" go to the root run "cd/" command  then enter go to the root "C:". Run command " ng new project-name "  like this "ng new angularApp " press enter.  go to our project folder "cd angularApp" press enter. run command " ng serve -o" this command run local server and shows your app on your browser http://localhost:4200. Extra command " https://github.com/angular/angular-cli/wiki"
Post a Comment
Read more