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.

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
Introduction to AngularjsIntroduction to Angularjs
Introduction to Angularjs
Manish Shekhawat
 
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
 
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)

Murdledescargadarkweb.pdfvolumen1 100 elementary
Murdledescargadarkweb.pdfvolumen1 100 elementaryMurdledescargadarkweb.pdfvolumen1 100 elementary
Murdledescargadarkweb.pdfvolumen1 100 elementary
JorgeSemperteguiMont
 
Introduction to Typescript - GDG On Campus EUE
Introduction to Typescript - GDG On Campus EUEIntroduction to Typescript - GDG On Campus EUE
Introduction to Typescript - GDG On Campus EUE
Google Developer Group On Campus European Universities in Egypt
 
Artificial Intelligence in the Nonprofit Boardroom.pdf
Artificial Intelligence in the Nonprofit Boardroom.pdfArtificial Intelligence in the Nonprofit Boardroom.pdf
Artificial Intelligence in the Nonprofit Boardroom.pdf
OnBoard
 
Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...
Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...
Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...
NTT DATA Technology & Innovation
 
Providing an OGC API Processes REST Interface for FME Flow
Providing an OGC API Processes REST Interface for FME FlowProviding an OGC API Processes REST Interface for FME Flow
Providing an OGC API Processes REST Interface for FME Flow
Safe Software
 
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdfcnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
AmirStern2
 
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
Your startup on AWS - How to architect and maintain a Lean and Mean account J...Your startup on AWS - How to architect and maintain a Lean and Mean account J...
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
angelo60207
 
Enabling BIM / GIS integrations with Other Systems with FME
Enabling BIM / GIS integrations with Other Systems with FMEEnabling BIM / GIS integrations with Other Systems with FME
Enabling BIM / GIS integrations with Other Systems with FME
Safe Software
 
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptxFIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Alliance
 
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data ResilienceFloods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Safe Software
 
Kubernetes Security Act Now Before It’s Too Late
Kubernetes Security Act Now Before It’s Too LateKubernetes Security Act Now Before It’s Too Late
Kubernetes Security Act Now Before It’s Too Late
Michael Furman
 
FIDO Alliance Seminar State of Passkeys.pptx
FIDO Alliance Seminar State of Passkeys.pptxFIDO Alliance Seminar State of Passkeys.pptx
FIDO Alliance Seminar State of Passkeys.pptx
FIDO Alliance
 
Oracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI FoundationsOracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI Foundations
VICTOR MAESTRE RAMIREZ
 
TrustArc Webinar - 2025 Global Privacy Survey
TrustArc Webinar - 2025 Global Privacy SurveyTrustArc Webinar - 2025 Global Privacy Survey
TrustArc Webinar - 2025 Global Privacy Survey
TrustArc
 
June Patch Tuesday
June Patch TuesdayJune Patch Tuesday
June Patch Tuesday
Ivanti
 
National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...
National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...
National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...
Safe Software
 
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Shashikant Jagtap
 
Your startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean accountYour startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean account
angelo60207
 
The State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry ReportThe State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry Report
Liveplex
 
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdfENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
Muhammad Rizwan Akram
 
Murdledescargadarkweb.pdfvolumen1 100 elementary
Murdledescargadarkweb.pdfvolumen1 100 elementaryMurdledescargadarkweb.pdfvolumen1 100 elementary
Murdledescargadarkweb.pdfvolumen1 100 elementary
JorgeSemperteguiMont
 
Artificial Intelligence in the Nonprofit Boardroom.pdf
Artificial Intelligence in the Nonprofit Boardroom.pdfArtificial Intelligence in the Nonprofit Boardroom.pdf
Artificial Intelligence in the Nonprofit Boardroom.pdf
OnBoard
 
Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...
Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...
Can We Use Rust to Develop Extensions for PostgreSQL? (POSETTE: An Event for ...
NTT DATA Technology & Innovation
 
Providing an OGC API Processes REST Interface for FME Flow
Providing an OGC API Processes REST Interface for FME FlowProviding an OGC API Processes REST Interface for FME Flow
Providing an OGC API Processes REST Interface for FME Flow
Safe Software
 
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdfcnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
cnc-drilling-dowel-inserting-machine-drillteq-d-510-english.pdf
AmirStern2
 
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
Your startup on AWS - How to architect and maintain a Lean and Mean account J...Your startup on AWS - How to architect and maintain a Lean and Mean account J...
Your startup on AWS - How to architect and maintain a Lean and Mean account J...
angelo60207
 
Enabling BIM / GIS integrations with Other Systems with FME
Enabling BIM / GIS integrations with Other Systems with FMEEnabling BIM / GIS integrations with Other Systems with FME
Enabling BIM / GIS integrations with Other Systems with FME
Safe Software
 
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptxFIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Seminar: Targeting Trust: The Future of Identity in the Workforce.pptx
FIDO Alliance
 
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data ResilienceFloods in Valencia: Two FME-Powered Stories of Data Resilience
Floods in Valencia: Two FME-Powered Stories of Data Resilience
Safe Software
 
Kubernetes Security Act Now Before It’s Too Late
Kubernetes Security Act Now Before It’s Too LateKubernetes Security Act Now Before It’s Too Late
Kubernetes Security Act Now Before It’s Too Late
Michael Furman
 
FIDO Alliance Seminar State of Passkeys.pptx
FIDO Alliance Seminar State of Passkeys.pptxFIDO Alliance Seminar State of Passkeys.pptx
FIDO Alliance Seminar State of Passkeys.pptx
FIDO Alliance
 
Oracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI FoundationsOracle Cloud Infrastructure AI Foundations
Oracle Cloud Infrastructure AI Foundations
VICTOR MAESTRE RAMIREZ
 
TrustArc Webinar - 2025 Global Privacy Survey
TrustArc Webinar - 2025 Global Privacy SurveyTrustArc Webinar - 2025 Global Privacy Survey
TrustArc Webinar - 2025 Global Privacy Survey
TrustArc
 
June Patch Tuesday
June Patch TuesdayJune Patch Tuesday
June Patch Tuesday
Ivanti
 
National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...
National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...
National Fuels Treatments Initiative: Building a Seamless Map of Hazardous Fu...
Safe Software
 
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2Agentic AI: Beyond the Buzz- LangGraph Studio V2
Agentic AI: Beyond the Buzz- LangGraph Studio V2
Shashikant Jagtap
 
Your startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean accountYour startup on AWS - How to architect and maintain a Lean and Mean account
Your startup on AWS - How to architect and maintain a Lean and Mean account
angelo60207
 
The State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry ReportThe State of Web3 Industry- Industry Report
The State of Web3 Industry- Industry Report
Liveplex
 
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdfENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
ENERGY CONSUMPTION CALCULATION IN ENERGY-EFFICIENT AIR CONDITIONER.pdf
Muhammad Rizwan Akram
 

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.