Scribd
Upload
26 views2 pages

Angular & DevOps Essentials

The document provides an overview of Angular development, including essential files like angular.json, package.json, and tsconfig.json, as well as the structure and creation of components. It explains data binding techniques such as interpolation, property binding, event binding, and two-way binding. Additionally, it outlines the commands for setting up projects and generating components in Angular.

Uploaded by

Raghav Khajuria
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
26 views2 pages

Angular & DevOps Essentials

The document provides an overview of Angular development, including essential files like angular.json, package.json, and tsconfig.json, as well as the structure and creation of components. It explains data binding techniques such as interpolation, property binding, event binding, and two-way binding. Additionally, it outlines the commands for setting up projects and generating components in Angular.

Uploaded by

Raghav Khajuria
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

devopps,

cicd pipeline

Angular: => nodejs(node -v, npm -v), angular cli(ng v),


angular.dev
create project ( ng new projectname),css,no. , to run
- ng serve

files to know in Angular


1. Angualar.json - main configuration file , blueprint or
tell angular how to build to serve application.
2. package.json = used by node.js and npm , it list all
dependencies and tools used in project,to work propperly.
3. tsconfig.json = It's a manual which tell typescript ,
how to convert ts code into javascript. which file include or exclude.
4. main.ts= Entry point of the application.

> Component- A component is a Ui that encapsulates its own


logic , html, css or help to break down the app in small and manageable parts,
each represent the a specific part of ui, like
button, a form, header, or a list .

To create component use command = ng generate component


componentname or ng g c componentname

> It has four main parts:-


1 typescript class(.ts):- In this we define the logic
for the component.
2 HTML template (.html file):- this is view of
component, it define the what UI looks like, We can use Angular template,
syntax to bind data from
typescript class to the HTML.
3 CSS style(.css) :- It handle styles, like font,
colour etc.
4 Decorator(@Component) :- It tell Angular that this
class is compponent class, and provide info like the template, and styles

===================================================================================
================================================================

DATA BINDING: -
Interpolation: Display data in the UI with {{ }}. ex :- <div class
="{{myClassName}}"> Danger </div>
Property Binding: Bind DOM properties with [ ]. ex :- <div [class] =
"myClassName">Danger</div>
Event Binding: Listen for events with ( ). ex :-
Two-Way Binding: Sync data both ways with [(ngModel)].

Interpolation ({{ }}):A way to display data from your component in the
HTML using double curly braces {{ }}.
Property Binding ([ ]):A method to bind a property of a DOM element
(like an image or input field) to a property in your component using square
brackets [ ].
Event Binding (( )): A way to listen for events (like clicks or key
presses) and call a method in your component when the event occurs, using
parentheses ( ).
Two-Way Binding ([(ngModel)]): Bind data in both directions between the
component and the view.

migrate

You might also like