web-dev-qa-db-fra.com

Quelle est la différence entre ng-app et data-ng-app?

J'ai commencé à apprendre AngularJS et je ne sais plus trop quelles sont les différences entre les directives ng-app et data-ng-app.

angularjsangularjs-directive
145
user1876508

La plupart de ces réponses disent simplement rend le modèle valide HTML, ou conforme au validateur HTML, sans expliquer ce que CES TERMES signifient.

Je ne sais pas avec certitude, mais je suppose que ces termes s'appliquent aux programmes de validation HTML qui analysent votre code pour vérifier sa conformité aux normes - un peu comme de la fibre. Ils ne reconnaissent pas ng-app en tant qu'attribut valide. Ils s’attendent à ce que les attributs HTML non par défaut soient précédés de

data-attribute_name_here.

Ainsi, les créateurs de AngularJS ont créé des noms alternatifs pour leurs directives qui incluent le data- devant eux afin que les programmes de validation HTML les "aiment".

123
Kirby L. Wallace

Aucune en termes de comportement d'exécution, il s'agit simplement de styles différents de directives de dénomination, comme décrit ici: http://docs.angularjs.org/guide/directive

Les directives ont des noms camel tels que ngBind. La directive peut être invoquée en traduisant le nom de l’affaire camel en une affaire snake avec ces caractères spéciaux:, - ou _. La directive peut éventuellement être préfixée par x ou data pour la rendre compatible avec le validateur HTML. Voici une liste de certains des noms de directive possibles: ng: bind, ng-bind, ng_bind, x-ng-bind et data-ng-bind.

Comme vous pouvez le constater en lisant cela, le data- peut être utilisé pour que votre HTML passe avec succès les tests du validateur HTML /

40
pkozlowski.opensource

Vous pouvez déclarer le angular espace de noms <html xmlns:ng="http://angularjs.org" ng-app>

6
Mounir

Dans les navigateurs modernes, il n'y a pas de différence, mais dans les anciens IE, ils ne fonctionneront que si vous déclarez un espace de nom XML le définissant.

Il existe également une différence de validation en ce que ng-app n'est pas un XHTML valide et entraînera l'échec des validations HTML de votre page Web. Angular vous permet de préfixer ses directives avec data- ou x- pour lui permettre de valider.

5
abject_error

Vous pouvez utiliser data-ng-, au lieu de ng-, si vous souhaitez rendre votre page HTML valide.
Ce sera jetter une erreur

<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>

Cela ne sera pas jette une erreur

<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>
4
Vahap Gençdal

La différence fondamentale entre ces deux termes est que data-ng-app valide le code HTML alors que ce dernier ne le fait pas. La fonctionnalité reste la même. Pour plus de référence, vous pouvez essayer w3Validator.

3
Abhishek Gakhar