SlideShare a Scribd company logo
AngularJS
JAGRITI SRIVASTAVA
Angular JS
 Javascript framework to build browser based applications
 Seems like single page application but loads multiple pages based on user
interaction.
 Written in javascript with light weight jQuery library called jQuery lite
 It encapsulates multiple portion of a page into a single page
 It is easy to write test and debug forming a well-defined, well-designed
and well-structured web pages.
Why Angular JS
 Allows to define custom tags in HTML.
 Uses Model View Framework (MVC)
 Model  It is the lowest level of the pattern responsible for maintaining
data.
 View  It is responsible for displaying all or a portion of the data to the
user.
 Controller  It is a software Code that controls the interactions between
the Model and View.
 Application written in AngularJS is cross-browser compliant. AngularJS
automatically handles JavaScript code suitable for each browser.
Angular as MVC
 The view are defined in HTML while model and controller are implemented
in javascript.
 Model has application data
 View is what is visible to the users of our application
 Controller acts as the link between the model and view.
MVC Model in Angularjs
Why Angular
 Uses less code than traditional Javascript application .
 Needs less DOM (Document Object Model) manipulation.
 It is easy to test application and develop them using test driven approach .
Core Features
 Data-binding-Automatic synchronization of data between model and view components.
 Scope − Objects that refer to the model. They act as a glue between controller and view.
 Controller − JavaScript functions that are bound to a particular scope.
 Services − AngularJS come with several built-in services for example
 $https: to make a XMLHttpRequests. These are singleton objects which are instantiated only
once in app.
 Filters − These select a subset of items from an array and returns a new array.
Core Features
 Directives − Markers on DOM elements (such as elements, attributes, css, and
more). To create custom HTML tags that serve as new, custom widgets.
 AngularJS has built-in directives (ngBind, ngModel...)
 Templates − These are the rendered view with information from the controller and
model. These can be a single file (like index.html) or multiple views in one page
using "partials".
 Routing − It is concept of switching views.
 Deep Linking − Deep linking allows you to encode the state of application in the
URL so that it can be bookmarked. The application can then be restored from the
URL to the same state.
 Dependency Injection − AngularJS has a built-in dependency injection subsystem
that helps the developer by making the application easier to develop, understand,
and test.
Ad

More Related Content

What's hot (20)

Mvc
MvcMvc
Mvc
abhigad
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVC
Emad Alashi
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVC
Sunpawet Somsin
 
Angular js for beginners
Angular js for beginnersAngular js for beginners
Angular js for beginners
Munir Hoque
 
Introduction to single page application with angular js
Introduction to single page application with angular jsIntroduction to single page application with angular js
Introduction to single page application with angular js
Mindfire Solutions
 
Angular js 1.3 basic tutorial
Angular js 1.3 basic tutorialAngular js 1.3 basic tutorial
Angular js 1.3 basic tutorial
Al-Mutaz Bellah Salahat
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJS
Shyjal Raazi
 
Angular JS Indtrodution
Angular JS IndtrodutionAngular JS Indtrodution
Angular JS Indtrodution
adesh21
 
Angular js anupama
Angular js anupamaAngular js anupama
Angular js anupama
Anupama Prabhudesai
 
Mortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazing
Mortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazingMortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazing
Mortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazing
Tom Walker
 
Asp.net mvc
Asp.net mvcAsp.net mvc
Asp.net mvc
Naga Harish M
 
Mvc3 crash
Mvc3 crashMvc3 crash
Mvc3 crash
Melick Baranasooriya
 
Mvc framework
Mvc frameworkMvc framework
Mvc framework
Dhurham Fahem
 
ASP.net MVC Introduction Wikilogia (nov 2014)
ASP.net MVC Introduction Wikilogia (nov 2014)ASP.net MVC Introduction Wikilogia (nov 2014)
ASP.net MVC Introduction Wikilogia (nov 2014)
Hatem Hamad
 
angularJS Practicle Explanation
angularJS Practicle ExplanationangularJS Practicle Explanation
angularJS Practicle Explanation
Abhishek Sahu
 
Mvc Brief Overview
Mvc Brief OverviewMvc Brief Overview
Mvc Brief Overview
rainynovember12
 
Web 2 0 Technologies
Web 2 0 TechnologiesWeb 2 0 Technologies
Web 2 0 Technologies
Prasad Perumal
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJS
David Parsons
 
Mvc 4 0_jayant_jindal_28082010
Mvc 4 0_jayant_jindal_28082010Mvc 4 0_jayant_jindal_28082010
Mvc 4 0_jayant_jindal_28082010
Rishu Mehra
 
Angular JS, steal the idea
Angular JS, steal the ideaAngular JS, steal the idea
Angular JS, steal the idea
Scott Lee
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVC
Emad Alashi
 
Introduction to ASP.NET MVC
Introduction to ASP.NET MVCIntroduction to ASP.NET MVC
Introduction to ASP.NET MVC
Sunpawet Somsin
 
Angular js for beginners
Angular js for beginnersAngular js for beginners
Angular js for beginners
Munir Hoque
 
Introduction to single page application with angular js
Introduction to single page application with angular jsIntroduction to single page application with angular js
Introduction to single page application with angular js
Mindfire Solutions
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJS
Shyjal Raazi
 
Angular JS Indtrodution
Angular JS IndtrodutionAngular JS Indtrodution
Angular JS Indtrodution
adesh21
 
Mortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazing
Mortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazingMortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazing
Mortal Kombat! ASP.NET MVC vs ASP.NET Webforms – ASP.NET MVC is amazing
Tom Walker
 
ASP.net MVC Introduction Wikilogia (nov 2014)
ASP.net MVC Introduction Wikilogia (nov 2014)ASP.net MVC Introduction Wikilogia (nov 2014)
ASP.net MVC Introduction Wikilogia (nov 2014)
Hatem Hamad
 
angularJS Practicle Explanation
angularJS Practicle ExplanationangularJS Practicle Explanation
angularJS Practicle Explanation
Abhishek Sahu
 
Introduction to AngularJS
Introduction to AngularJSIntroduction to AngularJS
Introduction to AngularJS
David Parsons
 
Mvc 4 0_jayant_jindal_28082010
Mvc 4 0_jayant_jindal_28082010Mvc 4 0_jayant_jindal_28082010
Mvc 4 0_jayant_jindal_28082010
Rishu Mehra
 
Angular JS, steal the idea
Angular JS, steal the ideaAngular JS, steal the idea
Angular JS, steal the idea
Scott Lee
 

Similar to Angular introduction basic (20)

Single Page Application
Single Page ApplicationSingle Page Application
Single Page Application
Prasad Narasimhan
 
Intoduction to Angularjs
Intoduction to AngularjsIntoduction to Angularjs
Intoduction to Angularjs
Gaurav Agrawal
 
One Weekend With AngularJS
One Weekend With AngularJSOne Weekend With AngularJS
One Weekend With AngularJS
Yashobanta Bai
 
AngularJS By Vipin
AngularJS By VipinAngularJS By Vipin
AngularJS By Vipin
Vipin Mundayad
 
Dive into Angular, part 1: Introduction
Dive into Angular, part 1: IntroductionDive into Angular, part 1: Introduction
Dive into Angular, part 1: Introduction
Oleksii Prohonnyi
 
Angularjs overview
Angularjs  overviewAngularjs  overview
Angularjs overview
VickyCmd
 
Angular js
Angular jsAngular js
Angular js
Silver Touch Technologies Ltd
 
Kalp Corporate Angular Js Tutorials
Kalp Corporate Angular Js TutorialsKalp Corporate Angular Js Tutorials
Kalp Corporate Angular Js Tutorials
Kalp Corporate
 
What is mean stack?
What is mean stack?What is mean stack?
What is mean stack?
Rishabh Saxena
 
angularjs_tutorial.docx
angularjs_tutorial.docxangularjs_tutorial.docx
angularjs_tutorial.docx
telegramvip
 
Angular js
Angular jsAngular js
Angular js
vu van quyet
 
Learning AngularJS - Complete coverage of AngularJS features and concepts
Learning AngularJS  - Complete coverage of AngularJS features and conceptsLearning AngularJS  - Complete coverage of AngularJS features and concepts
Learning AngularJS - Complete coverage of AngularJS features and concepts
Suresh Patidar
 
Angular js
Angular jsAngular js
Angular js
Arun Somu Panneerselvam
 
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdfangularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
sarah david
 
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptx
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptxangularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptx
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptx
sarah david
 
Angular js introduction
Angular js introductionAngular js introduction
Angular js introduction
Praveen Gubbala
 
angularjs-vs-angular-the-key-differences-between-javascript-and-typescript
angularjs-vs-angular-the-key-differences-between-javascript-and-typescriptangularjs-vs-angular-the-key-differences-between-javascript-and-typescript
angularjs-vs-angular-the-key-differences-between-javascript-and-typescript
Cuneiform Consulting Pvt Ltd.
 
Itroducing Angular JS
Itroducing Angular JSItroducing Angular JS
Itroducing Angular JS
Carlos Emanuel Mathiasen
 
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdfangularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
sarah david
 
Introduction to Angularjs : kishan kumar
Introduction to Angularjs : kishan kumarIntroduction to Angularjs : kishan kumar
Introduction to Angularjs : kishan kumar
Appfinz Technologies
 
Intoduction to Angularjs
Intoduction to AngularjsIntoduction to Angularjs
Intoduction to Angularjs
Gaurav Agrawal
 
One Weekend With AngularJS
One Weekend With AngularJSOne Weekend With AngularJS
One Weekend With AngularJS
Yashobanta Bai
 
Dive into Angular, part 1: Introduction
Dive into Angular, part 1: IntroductionDive into Angular, part 1: Introduction
Dive into Angular, part 1: Introduction
Oleksii Prohonnyi
 
Angularjs overview
Angularjs  overviewAngularjs  overview
Angularjs overview
VickyCmd
 
Kalp Corporate Angular Js Tutorials
Kalp Corporate Angular Js TutorialsKalp Corporate Angular Js Tutorials
Kalp Corporate Angular Js Tutorials
Kalp Corporate
 
angularjs_tutorial.docx
angularjs_tutorial.docxangularjs_tutorial.docx
angularjs_tutorial.docx
telegramvip
 
Learning AngularJS - Complete coverage of AngularJS features and concepts
Learning AngularJS  - Complete coverage of AngularJS features and conceptsLearning AngularJS  - Complete coverage of AngularJS features and concepts
Learning AngularJS - Complete coverage of AngularJS features and concepts
Suresh Patidar
 
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdfangularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
sarah david
 
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptx
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptxangularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptx
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pptx
sarah david
 
angularjs-vs-angular-the-key-differences-between-javascript-and-typescript
angularjs-vs-angular-the-key-differences-between-javascript-and-typescriptangularjs-vs-angular-the-key-differences-between-javascript-and-typescript
angularjs-vs-angular-the-key-differences-between-javascript-and-typescript
Cuneiform Consulting Pvt Ltd.
 
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdfangularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
angularjs_vs_angular_the_key_differences_between_javascript_and_typescript.pdf
sarah david
 
Introduction to Angularjs : kishan kumar
Introduction to Angularjs : kishan kumarIntroduction to Angularjs : kishan kumar
Introduction to Angularjs : kishan kumar
Appfinz Technologies
 
Ad

More from jagriti srivastava (15)

Map reduce with big data
Map reduce with big dataMap reduce with big data
Map reduce with big data
jagriti srivastava
 
Oyo rooms
Oyo roomsOyo rooms
Oyo rooms
jagriti srivastava
 
Information system of amazon
Information system of amazonInformation system of amazon
Information system of amazon
jagriti srivastava
 
JavaScript Canvas
JavaScript CanvasJavaScript Canvas
JavaScript Canvas
jagriti srivastava
 
Variable and Methods in Java
Variable and Methods in JavaVariable and Methods in Java
Variable and Methods in Java
jagriti srivastava
 
Component diagram and Deployment Diagram
Component diagram and Deployment DiagramComponent diagram and Deployment Diagram
Component diagram and Deployment Diagram
jagriti srivastava
 
Basic java, java collection Framework and Date Time API
Basic java, java collection Framework and Date Time APIBasic java, java collection Framework and Date Time API
Basic java, java collection Framework and Date Time API
jagriti srivastava
 
Form validation and animation
Form validation and animationForm validation and animation
Form validation and animation
jagriti srivastava
 
Custom directive and scopes
Custom directive and scopesCustom directive and scopes
Custom directive and scopes
jagriti srivastava
 
Angular directive filter and routing
Angular directive filter and routingAngular directive filter and routing
Angular directive filter and routing
jagriti srivastava
 
Starting with angular js
Starting with angular js Starting with angular js
Starting with angular js
jagriti srivastava
 
Scannerclass
ScannerclassScannerclass
Scannerclass
jagriti srivastava
 
Programming Workshop
Programming WorkshopProgramming Workshop
Programming Workshop
jagriti srivastava
 
Java Nested class Concept
Java Nested class ConceptJava Nested class Concept
Java Nested class Concept
jagriti srivastava
 
Java , A brief Introduction
Java , A brief Introduction Java , A brief Introduction
Java , A brief Introduction
jagriti srivastava
 
Ad

Recently uploaded (20)

tecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdftecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdf
fjgm517
 
Role of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered ManufacturingRole of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered Manufacturing
Andrew Leo
 
Leading AI Innovation As A Product Manager - Michael Jidael
Leading AI Innovation As A Product Manager - Michael JidaelLeading AI Innovation As A Product Manager - Michael Jidael
Leading AI Innovation As A Product Manager - Michael Jidael
Michael Jidael
 
What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...
Vishnu Singh Chundawat
 
Image processinglab image processing image processing
Image processinglab image processing  image processingImage processinglab image processing  image processing
Image processinglab image processing image processing
RaghadHany
 
Rock, Paper, Scissors: An Apex Map Learning Journey
Rock, Paper, Scissors: An Apex Map Learning JourneyRock, Paper, Scissors: An Apex Map Learning Journey
Rock, Paper, Scissors: An Apex Map Learning Journey
Lynda Kane
 
Big Data Analytics Quick Research Guide by Arthur Morgan
Big Data Analytics Quick Research Guide by Arthur MorganBig Data Analytics Quick Research Guide by Arthur Morgan
Big Data Analytics Quick Research Guide by Arthur Morgan
Arthur Morgan
 
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptxSpecial Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
shyamraj55
 
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdfComplete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Software Company
 
Cyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of securityCyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of security
riccardosl1
 
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath MaestroDev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
UiPathCommunity
 
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdfThe Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
Abi john
 
Drupalcamp Finland – Measuring Front-end Energy Consumption
Drupalcamp Finland – Measuring Front-end Energy ConsumptionDrupalcamp Finland – Measuring Front-end Energy Consumption
Drupalcamp Finland – Measuring Front-end Energy Consumption
Exove
 
Salesforce AI Associate 2 of 2 Certification.docx
Salesforce AI Associate 2 of 2 Certification.docxSalesforce AI Associate 2 of 2 Certification.docx
Salesforce AI Associate 2 of 2 Certification.docx
José Enrique López Rivera
 
Asthma presentación en inglés abril 2025 pdf
Asthma presentación en inglés abril 2025 pdfAsthma presentación en inglés abril 2025 pdf
Asthma presentación en inglés abril 2025 pdf
VanessaRaudez
 
"PHP and MySQL CRUD Operations for Student Management System"
"PHP and MySQL CRUD Operations for Student Management System""PHP and MySQL CRUD Operations for Student Management System"
"PHP and MySQL CRUD Operations for Student Management System"
Jainul Musani
 
Network Security. Different aspects of Network Security.
Network Security. Different aspects of Network Security.Network Security. Different aspects of Network Security.
Network Security. Different aspects of Network Security.
gregtap1
 
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc
 
Electronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploitElectronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploit
niftliyevhuseyn
 
Technology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data AnalyticsTechnology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data Analytics
InData Labs
 
tecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdftecnologias de las primeras civilizaciones.pdf
tecnologias de las primeras civilizaciones.pdf
fjgm517
 
Role of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered ManufacturingRole of Data Annotation Services in AI-Powered Manufacturing
Role of Data Annotation Services in AI-Powered Manufacturing
Andrew Leo
 
Leading AI Innovation As A Product Manager - Michael Jidael
Leading AI Innovation As A Product Manager - Michael JidaelLeading AI Innovation As A Product Manager - Michael Jidael
Leading AI Innovation As A Product Manager - Michael Jidael
Michael Jidael
 
What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...What is Model Context Protocol(MCP) - The new technology for communication bw...
What is Model Context Protocol(MCP) - The new technology for communication bw...
Vishnu Singh Chundawat
 
Image processinglab image processing image processing
Image processinglab image processing  image processingImage processinglab image processing  image processing
Image processinglab image processing image processing
RaghadHany
 
Rock, Paper, Scissors: An Apex Map Learning Journey
Rock, Paper, Scissors: An Apex Map Learning JourneyRock, Paper, Scissors: An Apex Map Learning Journey
Rock, Paper, Scissors: An Apex Map Learning Journey
Lynda Kane
 
Big Data Analytics Quick Research Guide by Arthur Morgan
Big Data Analytics Quick Research Guide by Arthur MorganBig Data Analytics Quick Research Guide by Arthur Morgan
Big Data Analytics Quick Research Guide by Arthur Morgan
Arthur Morgan
 
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptxSpecial Meetup Edition - TDX Bengaluru Meetup #52.pptx
Special Meetup Edition - TDX Bengaluru Meetup #52.pptx
shyamraj55
 
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdfComplete Guide to Advanced Logistics Management Software in Riyadh.pdf
Complete Guide to Advanced Logistics Management Software in Riyadh.pdf
Software Company
 
Cyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of securityCyber Awareness overview for 2025 month of security
Cyber Awareness overview for 2025 month of security
riccardosl1
 
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath MaestroDev Dives: Automate and orchestrate your processes with UiPath Maestro
Dev Dives: Automate and orchestrate your processes with UiPath Maestro
UiPathCommunity
 
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdfThe Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
The Evolution of Meme Coins A New Era for Digital Currency ppt.pdf
Abi john
 
Drupalcamp Finland – Measuring Front-end Energy Consumption
Drupalcamp Finland – Measuring Front-end Energy ConsumptionDrupalcamp Finland – Measuring Front-end Energy Consumption
Drupalcamp Finland – Measuring Front-end Energy Consumption
Exove
 
Salesforce AI Associate 2 of 2 Certification.docx
Salesforce AI Associate 2 of 2 Certification.docxSalesforce AI Associate 2 of 2 Certification.docx
Salesforce AI Associate 2 of 2 Certification.docx
José Enrique López Rivera
 
Asthma presentación en inglés abril 2025 pdf
Asthma presentación en inglés abril 2025 pdfAsthma presentación en inglés abril 2025 pdf
Asthma presentación en inglés abril 2025 pdf
VanessaRaudez
 
"PHP and MySQL CRUD Operations for Student Management System"
"PHP and MySQL CRUD Operations for Student Management System""PHP and MySQL CRUD Operations for Student Management System"
"PHP and MySQL CRUD Operations for Student Management System"
Jainul Musani
 
Network Security. Different aspects of Network Security.
Network Security. Different aspects of Network Security.Network Security. Different aspects of Network Security.
Network Security. Different aspects of Network Security.
gregtap1
 
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc Webinar: Consumer Expectations vs Corporate Realities on Data Broker...
TrustArc
 
Electronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploitElectronic_Mail_Attacks-1-35.pdf by xploit
Electronic_Mail_Attacks-1-35.pdf by xploit
niftliyevhuseyn
 
Technology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data AnalyticsTechnology Trends in 2025: AI and Big Data Analytics
Technology Trends in 2025: AI and Big Data Analytics
InData Labs
 

Angular introduction basic

  • 2. Angular JS  Javascript framework to build browser based applications  Seems like single page application but loads multiple pages based on user interaction.  Written in javascript with light weight jQuery library called jQuery lite  It encapsulates multiple portion of a page into a single page  It is easy to write test and debug forming a well-defined, well-designed and well-structured web pages.
  • 3. Why Angular JS  Allows to define custom tags in HTML.  Uses Model View Framework (MVC)  Model  It is the lowest level of the pattern responsible for maintaining data.  View  It is responsible for displaying all or a portion of the data to the user.  Controller  It is a software Code that controls the interactions between the Model and View.  Application written in AngularJS is cross-browser compliant. AngularJS automatically handles JavaScript code suitable for each browser.
  • 4. Angular as MVC  The view are defined in HTML while model and controller are implemented in javascript.  Model has application data  View is what is visible to the users of our application  Controller acts as the link between the model and view.
  • 5. MVC Model in Angularjs
  • 6. Why Angular  Uses less code than traditional Javascript application .  Needs less DOM (Document Object Model) manipulation.  It is easy to test application and develop them using test driven approach .
  • 7. Core Features  Data-binding-Automatic synchronization of data between model and view components.  Scope − Objects that refer to the model. They act as a glue between controller and view.  Controller − JavaScript functions that are bound to a particular scope.  Services − AngularJS come with several built-in services for example  $https: to make a XMLHttpRequests. These are singleton objects which are instantiated only once in app.  Filters − These select a subset of items from an array and returns a new array.
  • 8. Core Features  Directives − Markers on DOM elements (such as elements, attributes, css, and more). To create custom HTML tags that serve as new, custom widgets.  AngularJS has built-in directives (ngBind, ngModel...)  Templates − These are the rendered view with information from the controller and model. These can be a single file (like index.html) or multiple views in one page using "partials".  Routing − It is concept of switching views.  Deep Linking − Deep linking allows you to encode the state of application in the URL so that it can be bookmarked. The application can then be restored from the URL to the same state.  Dependency Injection − AngularJS has a built-in dependency injection subsystem that helps the developer by making the application easier to develop, understand, and test.