Development/AngularJS
angularjs - AngularJS tags
linuxism
2013. 10. 13. 11:45
I am learning about AngularJS and see it adds some of its own attributes that nor start with data neither are standard html tags attributes, like this: <html ng-app>
or this: <body ng-controller="PhoneListCtrl">
Where from do these ng-* attributes come and is that a valid HTML? Where can I read more about this? | asked Aug 24 '12 at 10:18 |
|
| |
| Strictly speaking these extra attributes are not defined in the HTML specifications thus, are not valid HTML. You could say that AngularJS provides and parses a superset of the HTML specification. However, as of v1.0.0rc1, you could use data-* attributes, for example <html data-ng-app> which, I believe, are valid HTML5. Source. There is a guide to the AngularJS Compiler that contains some more information on the process. In short; the AngularJS compiler reads your HTML page, using these attributes to guide it as it edits and updates your page, after loading, via javascript and the HTML DOM. | | answered Aug 24 '12 at 10:49 |
|
| |
| Where from do these ng-* attributes come
From main ng module. Source code. is that a valid HTML?
No. But attribute-style directives can be prefixed with x-, or data- to make it HTML validator compliant. See direcives documentation. | answered Aug 24 '12 at 10:55 |
|
| |
| From the docs: http://docs.angularjs.org/guide/directive <!doctype html>
<html data-ng-app>
<head>
<script src="http://code.angularjs.org/1.0.7/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div data-ng-controller="Ctrl1">
These are all valid directive declarations:<br/>
<input ng-model='name'> <hr/>
<span ng:bind="name"></span> <br/>
<span ng_bind="name"></span> <br/>
<span ng-bind="name"></span> <br/>
<span x-ng-bind="name"></span> <br/>
<span data-ng-bind="name"></span> <br/>
</div>
</body>
</html>
I like the data-*whatever* declaration the best as it's HTML5 compliant. So for any of my Angular declaration (e.g. ng-controller, ng-app, ng-repeat etc) or custom directives I'll always prefix them with data-. |
출처 - http://stackoverflow.com/questions/12107504/angularjs-tags-attributes
data-Xis HTML5-compliant, since thedata-prefix is for custom attributes.– Hugo Jun 23 at 8:19