AngularJS makes everything else look obsolete. I’m looking at you Backbone and Ember… It is one of those things where in hindsight the approach appears obvious because it is so elegant. However it took the web a good 15 years to arrive at this point. It makes jQuery look like VHS 😉
AngularJS’s biggest strength is how it automatically binds form data and DOM state in an intuitive spot called $scope. It keeps track of populating everything, firing events, showing/hiding blocks, even looping, sorting and filtering of arrays. It just works.
A short LIVE demo with code samples:
AngularJS Demo - Client Side CRUD Prototype
An example of backing a page with JSON, allowing local additions, local sorting, local filtering by name, and AngularjS form validation. Note - this demo works with AngularJS 1.1.5.
Name Filter:
| Name | Category |
|---|---|
| {{tree.name}} | {{tree.category}} |
The HTML5 - note the "ng-*" directives, those make the AngularJS wiring happen:
Other things I like about AngularJS:
- Change a variable in the $scope in one spot and it is reflected in the DOM and everywhere else that variable is referenced. This works for variables used programmatically, including pagination, search filters, etc. Very slick.
- Works great with JSON.
- Supports dependency injection.
- Unit test friendly.
- Has its own rendering syntax, which is denoted by {{ some.data }}, which starts with just enough power but allows you to extend. That aspect of it reminded me quite a bit of Django.
- Nothing is stopping you from using as many frameworks as you like along side it. There’s often no point in doing much with jQuery, but you can if you like.
- It is flexible in terms of which modules you choose to utilize. AngularJS may be used as a single page app, or stand alone in a more traditional full-page-load-per-request style app.
- It is easy to get started. The first few minutes of looking at it is a mind bender. However, after watching a 1 hour intro video I was pretty well oriented. You need to understand $scope, $routes, and how the app and its controllers fit together. After a day with it, and some pointers from a colleague who had done a couple apps in it, I was knocking out features at a good clip, perhaps even faster than I could with jQuery.
Like any software it has its weaknesses. What I don’t like about AngularJS:
- Still a little quirky. The docs don’t always line up with the version you may be using. I started with 1.0.8 then switched up to 1.1.5, which helped a lot.
- In terms of keeping legacy AngularJS apps updated, it would be painful to take a fully debugged 1.0.3 app that works in production and upgrade it to 1.2.x. There is just too much is going on under the hood. Note that I have not done that, but it is just the sense I get from working with it and seeing what kinds of stuff people are running into on StackOverflow.
- AngularJS is asynchronous in nature which can be tricky to program against, especially when dealing with security in a single page app.
- If you want to use an outside plugin, like a UI widget, be prepared for issues. It is up to you to make sure the widget events get applied to the scope, since it won’t know about them until you manually wire them in.