What is the difference between ng-app vs. data-ng-app and x-ng-app?

Today, I am going to share the difference between the some powerful angularjs prefix like ng-app vs. data-ng-app vs. x-ng-app.

This powerful prefix are used to decide when we need to use data.* , x.* and ng.*.

This is basic concept and use to validate the HTML template without using the data.* and x.* not possible to validate HTML template.

That means you can say that when we need to validate HTML Template that time we are using data.* or x.* otherwise we are using simple ng.*.

One other things on that: Some time throw error on a property like ng-app but don't throw an error with data-* or x.* like data-ng-app or x-ng-app.

For the conclusion we can say the only difference regarding HTML 5 validation and the best practice is used to data-ng-app or x-ng-app not ng-app.

KnockoutJs also uses data-* attributes.

//The normalization process of elements or attributes as given below.

The prefix x- and data- from the front of the element or attributes.  

Its convert the( :, -, or _-) delimited name to camelCase. The equivalent examples of elements/attributes that match ngApp.

Based on above statement below all are valid directives.

1. ng-app

2. ng:app

3. ng_app

4. data-ng-app

5. x-ng-app

//The normalization process of elements or attributes as given below.

The prefix x- and data- from the front of the element or attributes.  
Its convert the( :, -, or _-) delimited name to camelCase. The equivalent examples of elements/attributes that match ngApp.

Based on above statement below all are valid directives.

1. ng-app
2. ng:app
3. ng_app
4. data-ng-app
5. x-ng-app

Pin it

Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..

My Tech Blog - https://www.code-sample.com/
My Books - Book 1 and Book 2