J'apprends AngularJS et j'ai trouvé un code simple comme celui-ci:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
</head>
<body ng-app ng-init="name = 'World'">
<h1>Hello, {{name}}!</h1>
</body>
</html>
ne réussit pas le test de validation du W3C, principalement parce qu'il existe des attributs non standard (ng-app
, ng-init
).
La question est: devrais-je me préoccuper de la validation de mon application par le W3C? Devrais-je abandonner AngularJS?
Vous pouvez utiliser l'attribut data- html5 qui est standard et, autant que je sache, fonctionne de la même manière pour Angular .
data-ng-app=""
data-ng-init="xxx"
Fonctionnera de la même manière dans Angular et sera validé par W3C.
Regardez aussi ceci: ng-app vs data-ng-app, quelle est la différence?
En dehors de cela, mon expérience des normes est toujours meilleure lorsque votre produit sera livré à une foule importante (afin de créer un site Web ou une application Web publique, etc.) avec différents clients, versions, etc.…. Si vous construisez un SPA en utilisant angular et peut-être phonegap pour créer une application mobile qui sera installée sur les appareils mobiles en tant qu'application native, la norme ne pourrait pas être aussi importante, l'important est que cela fonctionne sur vos appareils cibles.
Mainteneur du validateur HTML5 du W3C ici. Nous avons discuté de la manière de faciliter la validation des documents contenant des attributs personnalisés, tels que les attributs ng-*
d'Angular, attributs qui, bien que non standard, soient encore très largement utilisés et utilisés correctement. Ainsi, le validateur émet des messages «d'erreur» concernant eux n'aide pas vraiment les auteurs.
Une fonctionnalité que j’ai ajoutée au validateur HTML5 pour atténuer ce problème est une fonctionnalité de «filtrage des messages» qui vous permet d’ignorer de manière persistante les messages d’erreur/avertissement qui ne sont ni importants ni utiles. Le frontend est ici:
Après avoir envoyé un document pour vérification, un bouton Filtre de filtrage apparaît sur la page des résultats. Si vous appuyez dessus, vous obtenez une liste de tous les messages d'erreur regroupés en ensembles, avec Afficher/Masquer. cases à cocher.
J'ai récemment ajouté la prise en charge de élémentspersonnalisés _ _ au Vérificateur HTML (validateur W3C). Ainsi, pour ajouter la prise en charge de attributs personnalisés, je pourrais utiliser un mécanisme semblable à ce que j'ai utilisé pour mettre en œuvre cela.
Toutefois, le vérificateur HTML ne peut pas être modifié pour autoriser les noms d’attributs personnalisés tant que la spécification HTML n’est pas mise à jour. Pour cela, voir la proposition en cours de discussion dans le suivi des problèmes HTML-spec .
Que vous "deviez" vous en soucier ou non, c'est à vous de décider. Il existe de nombreuses pages qui ne sont pas valides en HTML .
HTML5 autorise attributs personnalisés avec le préfixe data-
. Vous pouvez donc utiliser une des autres directives équivalentes comme:
<span data-ng-bind="name"></span>
Les conventions HTML sont là pour aider à prévenir les antipatterns et à maintenir le code maintenable.
Ouais. Dans cet ordre d'idées, j'ai récemment écrit un article un peu plus long à ce sujet dans la section «Pourquoi valider?» Que j'ai ajoutée à la section «À propos de» du programme de validation HTML5:
http://validator.w3.org/nu/about.html#why-validate
La source du texte de cette section est la suivante:
https://github.com/validator/validator/blob/master/site/nu-about.html#L160
Et les demandes de tirage avec les améliorations/ajouts suggérés sont les bienvenues.
Voici ce que j'ai actuellement:
La raison principale pour exécuter vos documents HTML à travers une conformité Le vérificateur est simple: pour détecter les erreurs non intentionnelles, vous pourriez commettre des erreurs ont manqué autrement - afin que vous puissiez les réparer.
Au-delà, certaines exigences de conformité des documents (règles de validité) dans la spécification HTML sont là pour vous aider et aider les utilisateurs de vos documents éviter certains types de problèmes potentiels. Expliquer la raison derrière ces exigences, la spécification HTML contient ces deux sections:
- justification des erreurs au niveau de la syntaxe
- justification des restrictions sur les modèles de contenu et sur l'attribut valeurs
Pour résumer ce qui est dit dans ces deux sections:
- Certains cas de marquage sont définis comme des erreurs car ils sont problèmes potentiels d'accessibilité, de convivialité, d'interopérabilité, la sécurité, ou la maintenabilité, ou parce qu'ils peuvent entraîner une mauvaise performances, ou qui pourrait entraîner l’échec de vos scripts. difficile à résoudre.
- Parallèlement à ceux-ci, certains cas de majoration sont définis sous forme d'erreurs car elles peuvent entraîner des problèmes potentiels dans Comportement de l'analyse et de la gestion des erreurs HTML - de sorte que, par exemple, vous vous retrouviez avec certains résultats non intuitifs et inattendus dans le DOM.
La validation de vos documents vous avertit de ces problèmes potentiels.
Utilisez le préfixe "data-" dans votre application angulaire . Exemple:
<body data-ng-app data-ng-init="name = 'World'">
<h1>Hello, {{name}}!</h1>
</body>
Vous pouvez utiliser le système de construction GulpJs et essayer un plugin que j'ai écrit qui fait exactement ce que vous voulez:
convertir ng-directives
en data-ng-directives
, qui correspond aux spécifications du W3C pour la validation html5.
Il est lourdement testé et se trouve ici: https://github.com/pgilad/gulp-angular-htmlify
Vous pouvez install with npm
:
$ npm install --save-dev gulp-angular-htmlify