Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Intro to AngularJS from DCC 04/14

351 Aufrufe

Veröffentlicht am

Intro to AngularJS from DCC 04/14

Veröffentlicht in: Technologie
  • Als Erste(r) kommentieren

  • Gehören Sie zu den Ersten, denen das gefällt!

Intro to AngularJS from DCC 04/14

  1. 1. Intro to Desert Code Camp - April 2014
  2. 2. About Me Chris Holwerda! Architect and developer for 15+ years in the financial, money codes, and credit card processing industry. MasterCard + PCI Compliance (Payment Card Industry) blog: chrisholwerda.com twitter: @cholwerda email: therealchrisholwerda@gmail.com SpeakerRate: http://speakerrate.com/chrisholwerda !
  3. 3. What is AngularJS? • Google • MVC • Opinionated • Extends html vocabulary • Dependency Injection • DOM object binding - don’t manipulate dom directly! • 2 way binding • Routing • Testable • Directives (Custom)
  4. 4. Why I like AngularJS • Don’t need view model setup • Pick a size • Lots of support • Easy to pick up and run with
  5. 5. What’s on the website?
  6. 6. Browser Support Works with most modern browsers Recent updates to Angular dropped support for ie8 If you are below that … sad face
  7. 7. Syntax • “ng” • element / attribute / class / (comment) • {{ expression }}
  8. 8. Directives Event Directives! ngClick ngDblClick ngMousedown ngMouseenter ngMouseleave ngMouseOver nbMouseUp ngChange Other Directives! ngApp ngBind ngBindTemplate ngBindHtml ngBindHtmlUnsafe ngHide ngShow ngCloak ngStyle ngClass ngClassEven ngClassOdd ngDisabled ngChecked ngMultiple ngReadOnly ngSelected ngForm ngSubmit ngHref ngSrc ngNonBindable
  9. 9. Services $http (ajax) $resource (restful) $q (promise/deferred execution) $anchorScroll (scrolls to element matching hashtag) $cacheFactory (in memory cache) $compile (markup compiler) $parse (eval expression return function) $locale (localization of date time formats) $timeout (of action) $exceptionHandler! $filter $cookieStore (access cookies) $interpolate (override ng internals) $log (log to console) $rootScope (1 per app, many child scopes) ! ! Limit these Dom services $window (Dom) $document (Dom) $rootElement (Dom - ng root element) ! $route (routes the page in app) $routeParams (parameters for routing) $location (location info and navigate
  10. 10. Show me some code! Enough Already!
  11. 11. Good Resources ! ! AngularJS website: angularjs.org AngularJS Extras (routes and stuff) Github Angular Seed: github.com/angular/angular-seed Pluralsight: Introduction to AngularJS + Advanced !