ANGULARJS A Gentle Introduction John Madison.NET User Group

AngularJS Overview Demos AGENDA

OVERVIEW

Framework. NOT a Library -Contains everything you need for SPA Broken into components – Controllers, view, models, services, etc MVC/MVVM Framework Two Way Data binding Enables test friendly code ANGULARJS – THE WHY

Performance -Framework not a library -Functions, not computed properties Directives – Powerful, not always intuitive Documentation ANGULARJS – THE WHY NOT

Get AngularJS – Bootstrap – DEMO 0 - GROUNDWORK

Ng-app, ng-model Magical {{}} Filters – DEMO 1 - INTRO/DATA BINDING

Ng-controller – Magical $scope – View model – Object context – Both controllers and directives have access to scope, but not each to other DEMO 2 - CONTROLLERS

Directives – HTML Dom markers (attributes, css class, etc) – Ng-repeat – Ng-filter – DEMO 3 –REPEAT

Order By – DEMO 4 – ORDER

Custom Logic Custom Filter function $log DEMO 5 – FUNCTIONS

Ng-show/ng-hide – – Ng-click – Directives – DEMO 6 - DIRECTIVES

Binding Images And something really cool DEMO LOU – A BRIEF INTERLUDE

Enable controlling of UX Separate work large products DEMO 8 – TEMPLATES

Encapsulate logic – Linked together via Dependency injection – eating_services eating_services Promises - $q – DEMO 9 - SERVICES

Create new elements! DEMO 10 – DATA BINDING

Ng-route JavaScript Dependency Injection $routeProvider and route creation Introduce ng-view DEMO 11 – ROUTES

QUESTIONS

August 11th - 13th 2014 Kalahari Resort Wisconsin Dells

John Ptacek Skyline Technologies / THANK YOU!!