What is the recommended practice for labelling Angular directives?
Other than html validation, are there any other benefits to prefixing both the in-built and my own custom directives with "data-"?
Or is it unnecessary clutter?
Asked
Active
Viewed 2,553 times
11
Brett Postin
- 11,215
- 10
- 60
- 95
-
In browsers that look at that strictly, your app might not work without it. – holographic-principle Apr 18 '13 at 09:45
-
possible duplicate of [What is the difference between ng-app and data-ng-app?](http://stackoverflow.com/questions/16184428/what-is-the-difference-between-ng-app-and-data-ng-app) – Blazemonger Jun 27 '14 at 17:02
-
Should the post asked after this one not have been flagged as a duplicate? – Brett Postin Jun 28 '14 at 09:05
-
Possible duplicate of [ng-app V/S data-ng-app in AngularJS](http://stackoverflow.com/questions/21110450/ng-app-v-s-data-ng-app-in-angularjs) – Ani Menon May 29 '16 at 06:10
2 Answers
9
I would say data- would be best practice. Since this will allow the html to validate, it should be a standard practice for developers. It may cause a bit of clutter, but overall I think it helps maintain the intergrity of the app and of the developer. And seeing as it doesn't matter to angular that I can tell thus far, then there really is no reason not to use data-.
selanac82
- 2,920
- 4
- 27
- 37
-
-
@djeendo you're absolutely right, but i would argue that it's worth the hits. especially if you are going to minify the html anyway. – selanac82 Dec 03 '14 at 15:19
0
You can use data-ng-, instead of ng-, if you want to make your page HTML valid.
This wont give error
<div ng-app="">
<p>Input something in the input box:</p>
<p>Name: <input type="text" ng-model="name"></p>
<p ng-bind="name"></p>
</div>
This will give error
<div data-ng-app="scope" data-ng-init="name='test'"
<p>Input something in the input box:</p>
<p>Name: <input type="text" data-ng-model="name"></p>
<p data-ng-bind="name"></p>
</div>
Vahap Gencdal
- 1,900
- 18
- 17