Download as PDF, PPTX
Spa with angular
- 1. Single Page Applications with Angular.js DannyVernovsky dannyv@sela.co.il @dimkinv
- 2. Agenda • Why webapplications are hard? • Angular.js, how to? (Movie lib) • Pros & cons • Q & A
- 3. Once upon atime... In 2005...
- 4.
- 5.
- 6. Angular.js as aframework • Based on MVC pattern o application.controller('myCtrl') • Can extend HTML vocabulary o application.directive('myElement') • Injectables o function($scope, $myService) • Two way binding o {{model.firstName}}
- 7. Controllers • Controllers arejust functions • Used to setup initial state with $scope • Used to setup behaivours
- 8. $scope • Holds themodel • Provide API's (e.g $watch) • Connects between view and controller
- 9.
- 10. Modules • No "main"method for application • Closed package code / reusable • No load order needed. application controllers services directives filters
- 11. Directives • All ng-*are directives!!! • Extends HTML with behaviour • Comes in various of flavors
- 12. Demo Movies Lib, Modules+ Directives
- 13. Services • Can bedeclared as service or factory • Usefull for DOM/data manipulations • Lazy loaded into memory
- 14.
- 15. Filters • Best usedto format expression. • Can be also used on collections • Angular.js built-in filters
- 16.
- 17. Single Page Application •Routes are the core of SPA • Can respond to deep linking URLs with $routeProvider • Rendered templates appied into ngView directive
- 18. Demo Movies Lib, CompleteExample
- 19. Lets sum up! Cons Takesfreedom Errors not always visible Complex to master
- 20. Pros Framework brings order Veryeasy to start Very declarative By Google (here to stay) Based on known pattern Created with testability in mind
- 21. Whats next? Angular.js 1.2RC1 •ng-animate with predefined animations • ‘controller as’ – aliases for controllers • finally, ng-if • better error messages for debugging • better documentation • And much more
- 22.