Just to clarify, double curly expressions in Angular, {{ }}, are "JS-like", basically a subset of JS + filter syntax. One goal of the expression syntax is to prevent a lot of app logic being stuck into the template itself, so the subset of JS is fairly minimal, but this is by design. This also means that the expressions are not eval()'d. Instead, they are parsed with Angular's $parse service.
Looks like they are never interpreted, but there are (at least) two different compilation strategies: 1) Anonymous function with a loop 2) Fully compiled Function constructed via JavaScript source with the loop unrolled In general, this bit of code seems to be optimized to a crazy degree.
It's also worth noting that the "filters" part of the expression is maintained as a pipeline in an array, since filters may inform bidiectional binding behavior.
I would kindly recommend you to read the Conceptual Overview section of the AngularJS Developer Guide (http://docs.angularjs.org/guide/concepts). This covers the heart of the framework and also parts of its philosophy. If you want to understand WHY AngularJS works the way it does not only WHAT it does then this page will really help you. You will also understand why this is a masterpiece of engineering.
If I want to have a page that has both server-side templating and client-side templating, I push the ng-app directive down into the DOM and assert that Angular has "ownership" of that portion of the page. I can't remember what Django's templating engine supports, but in Jinja2, you can create a {% raw %} {% endraw %} block that tells Jinja2 not to parse any delimiters in the block (I'm sure Django has something like this, I just can't recall what it is). This makes it pretty easy to separate out Angular's purview from the server's purview even on a single page.
var myApp = angular.module('myApp', [], function($interpolateProvider) {
$interpolateProvider.startSymbol("[[");
$interpolateProvider.endSymbol("]]");
});I also describe how to display the '{{' and '}}' strings in Jinja2, which is comically non-trivial :D
[1]: http://www.verdantrefuge.com/writing/2013/angularjs-custom-s...
what I am missing though (not a critic to your tutorial, just expressing my frustration as I try to learn beyond the basics) is concrete examples of how to implement specific features: authentication w/ express, nontrivial restful interaction, and interaction with Socket.IO. Most examples out there are so basic that they don't seem to keep any server state. Does anybody have some useful links?
BTW, coming from python/django, express does not seem to have an easy auth module to cover basic needs of db authentication. passport is overly complicated, and mongoose does not try to do auth. What do you hip node.js programmers use? Perhaps my problem is that I am trying to get familiar with node, express, nosql and client-side mvc frameworks at the same time and my head is just exploding. Or perhaps I am missing a framework with a full, well-documented stack! The more I try, the more I get tired of getting all these modules to work with each other :-)
Beyond that though, I've had to hack a fair bit to get "remember me" working (following the practices suggested http://stackoverflow.com/questions/549/the-definitive-guide-... and http://fishbowl.pastiche.org/2004/01/19/persistent_login_coo...) so not exactly straight-forward. (Aside: the remember me example for passport local might not be production ready, see http://stackoverflow.com/questions/16136712/is-an-authtoken-...).
Also would love to hear what others are using!
Excellent introduction.
Here are some of my concerns...
1. Spaghetti Code. "... AngularJS let you execute expressions directly within your HTML pages." Why do I want JavaScript code in my HTML at all? I normally like absolutely clean HTML templates for two main reasons: 1) They can be used & rendered anywhere 2) they are easier to maintain.
2. AngularJS Directives seem to mix control structures & Code inside HTML templates. This seems difficult to maintain... <div data-ng-repeat="user in users"> ... </div> JavaScript can do loops and most developers understand that. data-ng-repeat is only understood by AngularJS, which means this template will always need to be rendered by AnglularJS. Also, is the template forever tied to a "users" collection? What if I would like to reuse the template for "clients"?
<div data-ng-repeat="user in users" data-ng-show"=user.gender == 'female'">
...
</div>3. It seems as though the debate of DOM based rendering vs string based rendering is still going on, but do I have a choice with AngularJS? Right now, I'm not a fan string based rendering on the front-end because it locks me into a specific rendering engine (e.g. Handlebars, Mustache, Underscore etc.). Also, if you have no {{tokens}} in your templates you can render them on the server and then later update them on the front-end (I see the AngularJS devs say this is bad, but hybrid can be useful for security, SEO) . There are a number of DOM based templating engines out there. One I like very much is transparency. They have a great FAQ on this topic:
https://github.com/leonidas/transparency/wiki/Frequently-Ask...
4. "Using proper separation of concerns, controllers should never contain anything related to the DOM." Why is this the case? When would you ever use your controller outside of controlling the DOM in a Template? Is AngularJS's view that the Controller contains the event-handling function, but the View/Template does the binding?