angular.js - an introduction for the unitiated

21
AngularJS An introduction for the uninitiated

Upload: thehoagie

Post on 18-Jul-2015

811 views

Category:

Technology


2 download

TRANSCRIPT

AngularJSAn introduction for the uninitiated

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

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.

Trust Them...They are Experts

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

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

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

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

Two Way Data Binding

Angular applies all its evaluations when watched data changes

No binding to onkeyup, onkeydown, etc events

Keeps everything in sync

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

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

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

Where Would AngularJS be Bad?

Simple Javascript manipulations - creating an ng-controller is probably overkill for display toggles, etc

Questions from the Audience