Posted on 11/01/2013. By Pete Otaqui.
It’s true – I have a problem with AngularJS.
I love the sound of AngularJS (well, apart from all the “superhero” stuff) – it looks like they’ve put a lot of thought into the framework and people who are into it seem to be convinced, but there’s one thing that really bugs me about the homepage examples and prevents me from investing the time to find out more.
My problem is this part of one of the examples:
template: '<div class="tabbable">' + '<ul class="nav nav-tabs">' + '<li ng-repeat="pane in panes" ng-class="{active:pane.selected}">'+ '<a href="" ng-click="select(pane)">{{pane.title}}</a>' + '</li>' + '</ul>' + '<div class="tab-content" ng-transclude></div>' + '</div>', replace: true
What we can see here is AngularJS telling you to use a snippet of an object definition in javascript, specifically a template definition. Now, it’s one thing to invent a new syntax which sort of looks like mustache or handlebars, and it’s another thing to add a whole load of new non-standard attributes to html. Lots of people do the former (I’m thinking particularly of the BBC’s internal “Spectrum” here) and Dojo offered the latter as a way of declaratively configuring widgets a long time ago (and was lambasted by quite short sighted standardistas for it).
What bugs me with this example is both together, buried inside a string . I assume angular allows you to have external “templates” which would at least get you out of hell of quotation and escaping, but then you’ve also got the problem that your templates are now separate but tied to very specific things in controllers.
I could be wrong, maybe this doesn’t lead you down a hard-to-read or hard-to-maintain path. But it smells like it would to me.