Your SlideShare is downloading. ×
Single Page Application (SPA) using AngularJS
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Single Page Application (SPA) using AngularJS


Published on

Single Page Application (SPA) using angular js. Also have some relative sample codes. …

Single Page Application (SPA) using angular js. Also have some relative sample codes.
if u need then just mail me at

Published in: Technology
No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. Presented byMd. Rousonur JamanSecure Link Services Ltd.
  • 2. What is single page application? a web application that fits on a single web page providing a more fluid user experience similar to adesktop applicationCondition: all necessary code is retrieved with a single page load the page does not reload at any point in the process does not control transfer to another page20/5/2013 2SPA using AngularJS - Rouson
  • 3. What is AngularJS? Client Side Browser App Framework Sponsored by Google Open Source Augment browser-based applications with model–view–controller (MVC) capabilityBasically AngularJS is MVW Framework.What is MVW?model–view–whatever20/5/2013 3SPA using AngularJS - Rouson
  • 4. Why we choose AngularJS? Bootstrapping Templates 2-way data binding Module based Dependency Injection Routing Directives Unit Test20/5/2013 4SPA using AngularJS - Rouson
  • 5. Bootstrapping Automatic Initialization Manual Initialization20/5/2013 5SPA using AngularJS - Rouson
  • 6. Automatic Initialization Automatically initializesupon ’DOMContentLoaded’ event load the module associated with the directive. create the application injector compile the DOM treating the ng-app directive as theroot of the compilation.20/5/2013 6SPA using AngularJS - Rouson
  • 7. Manual Initialization Give more control over the initialization process need to perform an operation before Angular compilesa page20/5/2013 7SPA using AngularJS - Rouson
  • 8. TemplatesBelow attributes are used in a template: Directive — An attribute or element that augments anexisting DOM element or represents a reusable DOM Markup — The double curly brace notation {{ }} tobind expressions to elements is built-in angularmarkup. Filter — Formats your data for display to the user. Form controls — Lets you validate user input.20/5/2013 8SPA using AngularJS - Rouson
  • 9. Templates20/5/2013 9SPA using AngularJS - Rouson
  • 10. WITH CONTROLLERS20/5/2013 10SPA using AngularJS - Rouson
  • 11. ASYNC TEMPLATES AngularJS loads the templates asynchronously.20/5/2013 11SPA using AngularJS - Rouson
  • 12. 2-WAY DATA BINDING20/5/2013 12SPA using AngularJS - Rouson
  • 13. HOW IT WORKS?20/5/2013 13SPA using AngularJS - Rouson
  • 14. HOW IT WORKS?20/5/2013 14SPA using AngularJS - Rouson
  • 15. DEPENDENCY INJECTION20/5/2013 15SPA using AngularJS - Rouson
  • 16. HOW IT WORKS?20/5/2013 16SPA using AngularJS - Rouson
  • 17. ROUTING20/5/2013 17SPA using AngularJS - Rouson
  • 18. DIRECTIVES Main power of AngularJS An attribute or element that augments an existingDOM element or represents a reusable DOM20/5/2013 18SPA using AngularJS - Rouson
  • 19. Thank YouAny Question?20/5/2013 19SPA using AngularJS - Rouson