The ng-attributes of AngularJS do not pass the W3C validator

Question

The ng-attributes of AngularJS do not pass the W3C validator

Navigation

#1 by (3 votes)
#2 by (3 votes)

1

When I try to validate a page made with AngularJS, I find that it does not correctly validate and throws numerous errors in the code (it is usually the same repeated). The problem is that the attributes ng- are not considered standard and generate the failure.

For example, this simple code in AngularJS:

<!DOCTYPE html>
<html>
   <head>
    <title>Test con Angular</title>
    <script src="angular.js"></script>
  </head> 
  <body ng-app ng-init="nombre='Juan'; apellido='Tanamera';">
    <strong>Nombre:</strong> {{nombre}}<br />
    <strong>Apellido:</strong> <span ng-bind="apellido"></span>
  </body>
</html>

When I pass it through the W3C code validator , it throws me the following error:

Error: Attribute ng-app not allowed on element body at this point.

From line 8, column 1; to line 8, column 61
↩</head>↩↩<body ng-app ng-init="firstName = 'John'; lastName = 'Doe';">↩  <st

And now the questions:

Should I worry about not validating the code?
Is there a way to change it so that the validator does pass?

html angularjs angular-directivas

asked by Alvaro Montoro 07.12.2016 в 18:17

source

2 answers

3

Angular allows x- and data-prefixes for your custom attributes. You can use data-ng-app , data-ng-bind and data-ng-init .

<!DOCTYPE html>
<html>
   <head>
    <title>Test con Angular</title>
    <script src="angular.js"></script>
  </head> 
  <body data-ng-app data-ng-init="nombre='Juan'; apellido='Tanamera';">
    <strong>Nombre:</strong> {{nombre}}<br />
    <strong>Apellido:</strong> <span data-ng-bind="apellido"></span>
  </body>
</html>

answered by 07.12.2016 в 18:36

Problems when deploying Glide with GridView on Android Some jquery function to control an input only numbers are written?

score 3 · Accepted Answer

Should I worry about not validating the code?

An example: If we validate google.es in W3C we would have at the moment 22 errors !

In this video (English) explains google that does not validate by performance theme.

Should we worry then?

Yes , but you have to differentiate between syntactic errors in the document and between errors caused by unknown attributes.

Some common errors in W3C-Validator:

Vendor Prefix : -webkit- -moz- -o- -ms-
meta http-equiv="X-UA-Compatible" content="IE=edge"

The unknown attributes, like in your example ng-app ng-init , are not errors that affect the representation of the page, but if it gives an error in the W3C - Validator , however , syntactic errors of the document if it could affect you (according to browser and error) the representation of the page and of course it would give error in W3C - Validator .

Is there a way to change it so that the validator does pass?

As mentioned by the partner Ziul in your answer can be added to the attributes
ng-app ng-init etc. the prefix data- which does not have any difference when using it and would go through the W3C - Validator as valid.

Conclusion (personal):

We must minimize and / or eliminate all possible errors that the validator of the W3C gives us and take into account that if it is due to syntactic errors or unknown attributes.