SlideShare a Scribd company logo
1 of 9
ANGULAR FRAMEWORK:
BUILDING BLOCKS OF THE FUTURE
.
CONTENTS
Introduction to Angular Framework
Components in Angular
Directives in Angular
Services in Angular
Routing in Angular
Conclusion
INTRODUCTION
Angular is a popular front-end framework for building web applications. It is
maintained by Google and has gained a lot of popularity in recent years.
Angular is based on the Model-View-Controller (MVC) architecture, which
separates the application into three interconnected components.
. 3
COMPONENTS IN
ANGULAR
In Angular, a component is the fundamental building block of an
application. A component consists of a template, which defines the
layout and structure of the component, and a class, which contains the
component's logic and data. Components can be nested within other
components to create complex user interfaces.
Angular provides a powerful set of tools for creating and managing
components..
COMPONENTS IN ANGULAR
. 5
• In Angular, a component is the fundamental building block of an application. A component consists of a
template, which defines the layout and structure of the component, and a class, which contains the
component's logic and data. Components can be nested within other components to create complex
user interfaces.
• Angular provides a powerful set of tools for creating and managing components. These tools include the
Component Decorator, which allows you to define a component's metadata, and the NgModule
Decorator, which allows you to organize your components into modules.
DIRECTIVES IN ANGULAR.
Directives are another key feature of the Angular framework. Directives
allow you to extend HTML with custom behaviour and functionality.
There are two types of directives in Angular: structural and attribute
directives.
Structural directives modify the DOM layout by adding or removing
elements, while attribute directives modify the behaviour or appearance
of existing elements. Angular provides several built-in directives,, and
also allows you to create your own custom directives.
6
SERVICES IN ANGULAR
. 7
SERVICES ARE A WAY TO SHARE DATA AND FUNCTIONALITY ACROSS DIFFERENT PARTS OF AN ANGULAR
APPLICATION. SERVICES ARE TYPICALLY USED TO HANDLE DATA RETRIEVAL AND STORAGE, AS WELL AS
TO PROVIDE COMMON FUNCTIONALITY THAT IS NEEDED THROUGHOUT THE APPLICATION.
ANGULAR PROVIDES A POWERFUL DEPENDENCY INJECTION SYSTEM THAT MAKES IT EASY TO INJECT
SERVICES INTO COMPONENTS AND OTHER SERVICES. THIS ALLOWS YOU TO EASILY MANAGE
DEPENDENCIES BETWEEN DIFFERENT PARTS OF YOUR APPLICATION AND MAKES IT EASY TO TEST AND
MAINTAIN YOUR CODE.
.
.
. . .
CONCLUSION
. 8
Angular is a powerful and flexible front-end framework that
provides a comprehensive set of tools for building complex web
applications. With its modular architecture, powerful directives, and
robust dependency injection system, Angular makes it easy to
develop and maintain large-scale applications.
Whether you're building a simple website or a complex enterprise
application, Angular has everything you need to get the job done.
THANK YOU
• query@cetpainfotech.com
• 91-9212172602
• D-58, Sector-2, Near Red FM.
Noida -201301,Uttar Pradesh
• www.cetpainfotech.com

More Related Content

Similar to Angular Framework.pptx

Angular crash course
Angular crash courseAngular crash course
Angular crash courseBirhan Nega
 
What are the success benefits of AngularJS development.pdf
What are the success benefits of AngularJS development.pdfWhat are the success benefits of AngularJS development.pdf
What are the success benefits of AngularJS development.pdfDream Cyber Infoway
 
10 Reasons to Choose Angular for Web App Development.pdf
10 Reasons to Choose Angular for Web App Development.pdf10 Reasons to Choose Angular for Web App Development.pdf
10 Reasons to Choose Angular for Web App Development.pdfWebGuru Infosystems Pvt. Ltd.
 
The Pros and Cons of Angular Development: All You Need to Know
The Pros and Cons of Angular Development: All You Need to KnowThe Pros and Cons of Angular Development: All You Need to Know
The Pros and Cons of Angular Development: All You Need to KnowHepto Software Company
 
Modern webtechnologies
Modern webtechnologiesModern webtechnologies
Modern webtechnologiesBesjan Xhika
 
Single Page Applications in SharePoint with Angular
Single Page Applications in SharePoint with AngularSingle Page Applications in SharePoint with Angular
Single Page Applications in SharePoint with AngularSparkhound Inc.
 
Angular Interview Questions in 2023 - Instaily Academy
Angular Interview Questions in 2023 - Instaily AcademyAngular Interview Questions in 2023 - Instaily Academy
Angular Interview Questions in 2023 - Instaily AcademyInstaily Academy
 
Building blocks of Angular
Building blocks of AngularBuilding blocks of Angular
Building blocks of AngularKnoldus Inc.
 
Top Reasons to use the Angular Framework for developing Applications!
Top Reasons to use the Angular Framework for developing Applications!Top Reasons to use the Angular Framework for developing Applications!
Top Reasons to use the Angular Framework for developing Applications!Shelly Megan
 
Angular for Beginners: A Comprehensive Guide
Angular for Beginners: A Comprehensive GuideAngular for Beginners: A Comprehensive Guide
Angular for Beginners: A Comprehensive GuideCMARIX TechnoLabs
 
What is Angular Programming Language.pdf
What is Angular Programming Language.pdfWhat is Angular Programming Language.pdf
What is Angular Programming Language.pdfNishaadequateinfosof
 
Angular Best Practices To Build Clean and Performant Web Applications
Angular Best Practices To Build Clean and Performant Web ApplicationsAngular Best Practices To Build Clean and Performant Web Applications
Angular Best Practices To Build Clean and Performant Web ApplicationsAlbiorix Technology
 
Dive into Angular, part 1: Introduction
Dive into Angular, part 1: IntroductionDive into Angular, part 1: Introduction
Dive into Angular, part 1: IntroductionOleksii Prohonnyi
 
Introduction to Angular2
Introduction to Angular2Introduction to Angular2
Introduction to Angular2Knoldus Inc.
 
What You Really Want To Be Aware (2).pptx
What You Really Want To Be Aware (2).pptxWhat You Really Want To Be Aware (2).pptx
What You Really Want To Be Aware (2).pptxreshu khan
 

Similar to Angular Framework.pptx (20)

Angular crash course
Angular crash courseAngular crash course
Angular crash course
 
What are the success benefits of AngularJS development.pdf
What are the success benefits of AngularJS development.pdfWhat are the success benefits of AngularJS development.pdf
What are the success benefits of AngularJS development.pdf
 
10 Reasons to Choose Angular for Web App Development.pdf
10 Reasons to Choose Angular for Web App Development.pdf10 Reasons to Choose Angular for Web App Development.pdf
10 Reasons to Choose Angular for Web App Development.pdf
 
The Pros and Cons of Angular Development: All You Need to Know
The Pros and Cons of Angular Development: All You Need to KnowThe Pros and Cons of Angular Development: All You Need to Know
The Pros and Cons of Angular Development: All You Need to Know
 
Modern webtechnologies
Modern webtechnologiesModern webtechnologies
Modern webtechnologies
 
Single Page Applications in SharePoint with Angular
Single Page Applications in SharePoint with AngularSingle Page Applications in SharePoint with Angular
Single Page Applications in SharePoint with Angular
 
What is Angular?
What is Angular?What is Angular?
What is Angular?
 
Angular Interview Questions in 2023 - Instaily Academy
Angular Interview Questions in 2023 - Instaily AcademyAngular Interview Questions in 2023 - Instaily Academy
Angular Interview Questions in 2023 - Instaily Academy
 
Building blocks of Angular
Building blocks of AngularBuilding blocks of Angular
Building blocks of Angular
 
Top Reasons to use the Angular Framework for developing Applications!
Top Reasons to use the Angular Framework for developing Applications!Top Reasons to use the Angular Framework for developing Applications!
Top Reasons to use the Angular Framework for developing Applications!
 
Angular for Beginners: A Comprehensive Guide
Angular for Beginners: A Comprehensive GuideAngular for Beginners: A Comprehensive Guide
Angular for Beginners: A Comprehensive Guide
 
Angular Web App Development
Angular Web App DevelopmentAngular Web App Development
Angular Web App Development
 
17612235.ppt
17612235.ppt17612235.ppt
17612235.ppt
 
What is Angular Programming Language.pdf
What is Angular Programming Language.pdfWhat is Angular Programming Language.pdf
What is Angular Programming Language.pdf
 
Angular 9
Angular 9 Angular 9
Angular 9
 
Angular Best Practices To Build Clean and Performant Web Applications
Angular Best Practices To Build Clean and Performant Web ApplicationsAngular Best Practices To Build Clean and Performant Web Applications
Angular Best Practices To Build Clean and Performant Web Applications
 
Dive into Angular, part 1: Introduction
Dive into Angular, part 1: IntroductionDive into Angular, part 1: Introduction
Dive into Angular, part 1: Introduction
 
Angular js
Angular jsAngular js
Angular js
 
Introduction to Angular2
Introduction to Angular2Introduction to Angular2
Introduction to Angular2
 
What You Really Want To Be Aware (2).pptx
What You Really Want To Be Aware (2).pptxWhat You Really Want To Be Aware (2).pptx
What You Really Want To Be Aware (2).pptx
 

Recently uploaded

_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting Data_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting DataJhengPantaleon
 
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology  ( Production , Purification , and Application  ) Hybridoma Technology  ( Production , Purification , and Application  )
Hybridoma Technology ( Production , Purification , and Application ) Sakshi Ghasle
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Celine George
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Sanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfSanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfsanyamsingh5019
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeThiyagu K
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxOH TEIK BIN
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Krashi Coaching
 
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxContemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxRoyAbrique
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Educationpboyjonauth
 
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...Marc Dusseiller Dusjagr
 
How to Make a Pirate ship Primary Education.pptx
How to Make a Pirate ship Primary Education.pptxHow to Make a Pirate ship Primary Education.pptx
How to Make a Pirate ship Primary Education.pptxmanuelaromero2013
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdfSoniaTolstoy
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon AUnboundStockton
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Sapana Sha
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptxVS Mahajan Coaching Centre
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991RKavithamani
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptxPoojaSen20
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxiammrhaywood
 

Recently uploaded (20)

_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting Data_Math 4-Q4 Week 5.pptx Steps in Collecting Data
_Math 4-Q4 Week 5.pptx Steps in Collecting Data
 
Hybridoma Technology ( Production , Purification , and Application )
Hybridoma Technology  ( Production , Purification , and Application  ) Hybridoma Technology  ( Production , Purification , and Application  )
Hybridoma Technology ( Production , Purification , and Application )
 
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
Incoming and Outgoing Shipments in 1 STEP Using Odoo 17
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
Sanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdfSanyam Choudhary Chemistry practical.pdf
Sanyam Choudhary Chemistry practical.pdf
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
 
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
 
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxContemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Education
 
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
“Oh GOSH! Reflecting on Hackteria's Collaborative Practices in a Global Do-It...
 
How to Make a Pirate ship Primary Education.pptx
How to Make a Pirate ship Primary Education.pptxHow to Make a Pirate ship Primary Education.pptx
How to Make a Pirate ship Primary Education.pptx
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
 
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111Call Girls in Dwarka Mor Delhi Contact Us 9654467111
Call Girls in Dwarka Mor Delhi Contact Us 9654467111
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
 
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
 
PSYCHIATRIC History collection FORMAT.pptx
PSYCHIATRIC   History collection FORMAT.pptxPSYCHIATRIC   History collection FORMAT.pptx
PSYCHIATRIC History collection FORMAT.pptx
 
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptxSOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
 

Angular Framework.pptx

  • 2. CONTENTS Introduction to Angular Framework Components in Angular Directives in Angular Services in Angular Routing in Angular Conclusion
  • 3. INTRODUCTION Angular is a popular front-end framework for building web applications. It is maintained by Google and has gained a lot of popularity in recent years. Angular is based on the Model-View-Controller (MVC) architecture, which separates the application into three interconnected components. . 3
  • 4. COMPONENTS IN ANGULAR In Angular, a component is the fundamental building block of an application. A component consists of a template, which defines the layout and structure of the component, and a class, which contains the component's logic and data. Components can be nested within other components to create complex user interfaces. Angular provides a powerful set of tools for creating and managing components..
  • 5. COMPONENTS IN ANGULAR . 5 • In Angular, a component is the fundamental building block of an application. A component consists of a template, which defines the layout and structure of the component, and a class, which contains the component's logic and data. Components can be nested within other components to create complex user interfaces. • Angular provides a powerful set of tools for creating and managing components. These tools include the Component Decorator, which allows you to define a component's metadata, and the NgModule Decorator, which allows you to organize your components into modules.
  • 6. DIRECTIVES IN ANGULAR. Directives are another key feature of the Angular framework. Directives allow you to extend HTML with custom behaviour and functionality. There are two types of directives in Angular: structural and attribute directives. Structural directives modify the DOM layout by adding or removing elements, while attribute directives modify the behaviour or appearance of existing elements. Angular provides several built-in directives,, and also allows you to create your own custom directives. 6
  • 7. SERVICES IN ANGULAR . 7 SERVICES ARE A WAY TO SHARE DATA AND FUNCTIONALITY ACROSS DIFFERENT PARTS OF AN ANGULAR APPLICATION. SERVICES ARE TYPICALLY USED TO HANDLE DATA RETRIEVAL AND STORAGE, AS WELL AS TO PROVIDE COMMON FUNCTIONALITY THAT IS NEEDED THROUGHOUT THE APPLICATION. ANGULAR PROVIDES A POWERFUL DEPENDENCY INJECTION SYSTEM THAT MAKES IT EASY TO INJECT SERVICES INTO COMPONENTS AND OTHER SERVICES. THIS ALLOWS YOU TO EASILY MANAGE DEPENDENCIES BETWEEN DIFFERENT PARTS OF YOUR APPLICATION AND MAKES IT EASY TO TEST AND MAINTAIN YOUR CODE. . . . . .
  • 8. CONCLUSION . 8 Angular is a powerful and flexible front-end framework that provides a comprehensive set of tools for building complex web applications. With its modular architecture, powerful directives, and robust dependency injection system, Angular makes it easy to develop and maintain large-scale applications. Whether you're building a simple website or a complex enterprise application, Angular has everything you need to get the job done.
  • 9. THANK YOU • query@cetpainfotech.com • 91-9212172602 • D-58, Sector-2, Near Red FM. Noida -201301,Uttar Pradesh • www.cetpainfotech.com