After diving into backbone last month, I thought it’s time to have a look at AngularJS. What’s the hype with AngularJS? Why is it a popular choice for large scale websites? I often ask people at meet-ups whether their company uses Backbone, Ember and/or Angular and quite a few people usually reply with ‘Angular’. My next question usually would be why they have decided to choose AngularJS and majority of the responses is that AngularJS is backed by Google and that there is a wider support and documentation.
AngularJS is considered a new paradigm for web development. Why? Well, here are some Angular vocabulary and examples to show you just how powerful Angular can be…
Directives
One of the first observations I made when I first started looking into Angular was the statement on the AngularJS website; “AngularJS is what HTML would have been” – that’s a pretty strong and bold statement! AngularJS allows you to ‘extend’ the HTML vocabulary. You can set your own ‘directives‘; custom attributes and elements.
<html ng-app="ngApp">
The ng-app attribute in the html tag above is an example of a directive which is used to auto-boostrap the application. This is commonly forgotten by beginners.
Data Binding
The two way data binding in Angular is extremely powerful and simple – it’s automatic synchronisation! When the model changes, so does the view.
<input type="text" ng-model="firstName" />
hi {{firstName}}!
Filters
AngularJS comes with many handy filters built-in. Filters allow you to manipulate and filter the presentation of your views. You can apply Angular filters directly by extending the bindings in your HTML views
{{ 12 | currency }}
The Code School “AngularJS Tutorial for Beginners” is also a great way to get an insight of what it’s like to code in Angular.
There are still lots to learn in AngularJS – will definitely write more as I dive deeper… stay tuned!
Adelaine Ho 