Angular.js novice impressions

I’ve gone through an Angular.js tutorial (which is very nice by the way!) http://campus.codeschool.com/courses/shaping-up-with-angular-js/ and there is a good thing and a not so nice thing that I’ve found.

The Good Thing: Filters

It is sooooooo nice syntax idea to use pipe for applying filters!
Just a few examples:

{{ product.price | currency }}
{{ ‘1445766299358’ | date: ‘MM/dd/yyyy @ h:mma’ }}

Super cool!

The NotSoNice thing: ng- attributes format multiplicity

What happens is that you can write ng- attributes in all these various ways:

And probably after a close look you will start to understand the reason why it is like that in each case.

For example:
1 — we need to evaluate the product.images[0] expression right away when rendering the page and put the resulting value into the ng-src attribute. This looks fine. But actually we have to reevaluate this attribute each time page is rerendered because product may change. So this expression is dynamic.

2 — this expression is also dynamic so that we have to store it and reevaluate each time the tab variable is changed. I don’t see real difference compared to the first expression.
UPDATE so here we have an object so that you can use multiple classes.
It would be more readable though if it looked like this:
ng-class=”{ active: (tab === 1) }”.

3 — here I don’t understand why not to use any of the expression syntax above. Maybe because it is an assignment expression?

4 — here single quotes are needed because probably you can also use a variable in ng-include attribute. So basically it is a normal js expression. The only thing is because we are in html it looks a bit weird: quotes inside quotes. But it is reasonable.

Cheers!

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.