Angular.js 1.x presentation outlining resource management, view templating, filtering, directives, two way data binding, managed event bindings, routing. Demo referenced in slides can be found at https://github.com/bsimpson/angular_pdx Download the git repo, and to pull up the relevant demo code, use git checkout to switch to the relevant tag. Tag names are self descriptive and usually align with the slide title

1. AngularJS
An introduction for the uninitiated

2. Why Do I need Angular?
● Resource management (managed AJAX)
● View templating
● Filtering (text formatting, and array selection)
● Semantic, reusable templates (directives)
● Two-way data binding (no more callbacks)
● Managed event bindings
● Routing for multiple client side views

3. Besides...
Its 2014. Everyone uses Javascript. The key is
managing it effectively
You probably have homegrown solutions for
the bullet points on the previous slide. Eww.

4. Trust Them...They are Experts

5. AngularJS Resources
Forget $ajax() in favor of $resource()
With one command, you wrap a RESTful
resource and are provided: get, save, query,
delete
Uses promises for callback management

7. View Templating
Angular has powerful templating directives to
iterate over JS objects
ng-repeat, ng-if, ng-unless, ng-show, ng-class,
etc
Divorces presentation from data - send JSON

9. Filtering
Inside brackets, can “pipe” date to filter for
formatting
currency, date, lowercase, uppercase, orderBy,
etc
Can be done in the view, or in Javascript

11. Directives
Directives allow reusable pieces of HTML and
event bindings
Can be used for semantic markup, matching
element name, attribute, or class
“Templates” by any other name

13. Two Way Data Binding
Angular applies all its evaluations when
watched data changes
No binding to onkeyup, onkeydown, etc events
Keeps everything in sync

15. Event binding
Moves event binding back to views
ng-click, ng-submit, etc
Binds to functions in the controller. Two way
data binding takes care of a lot of the screen
updates w/o explicit events

17. Routing
Client side solution for managing hyperlinks
Can extract params from the URL similar to
Rails routes
Makes use of HTML5 location features to work
with back button

19. When Would AngularJS be Good?
Javascript-rich, client-side interactions
Anywhere with a lot of unstructured Javascript
binding to DOM and events
Anywhere multiple updates need to be made to
the screen when data changes

20. Where Would AngularJS be Bad?
Simple Javascript manipulations - creating an
ng-controller is probably overkill for display
toggles, etc

21. Questions from the
Audience