AngularJS and HTML Validation

| Posted | Comments |

So I've started learning more about AngularJS. However, one thing about AngularJS has continued to bug the hell out of me. It has to do with all those 'ng-' attributes that riddle your HTML and make the code invalid. Not that tag attributes are bad per se. It's just that an attribute with a 'ng-' prefix isn't consider least not yet. So the question becomes: How do I make my HTML valid with AngularJS?

The answer is really quite simple: just add a 'data-' prefix to all your 'ng-' attributes. 'ng-app' becomes 'data-ng-app' and so on. I tested this out with the AngularJS version of the TodoMVC app and it works just fine. The only thing extra I had to do was convert the 'ng-pluralize' custom tag into a span and use attributes to initialize the 'ng-pluralize' directive. Other than that, it validated well and no issues with the app.

AngularJS is a beast; an 800 pound gorilla for sure. Lots to learn! But knowing that I can make it work in a highly valid way is definitely good to know.