103 votes

Positionnement de la directive ng-app (html vs body)

J'ai récemment revu le code pour une webapp construit angulaire et a constaté qu'il a été écrit avec l' ng-app="myModule" directive placé sur l' <body> balise. Lors de l'apprentissage angulaire, je ne l'ai jamais vu utilisé sur l' <html> balise, comme recommandé par l'angle de docs ici, ici, et dans leur tutoriel.

J'ai exploré un peu sur mon propre et a trouvé TELLEMENT de questions, notamment en ce un et, de même, ce un seul, que de discuter le chargement de plusieurs modules pour une page. Cependant, cette technique différente de mon cas, car il consiste à placer ng-app sur les éléments à l'intérieur de l'organisme et de l'utilisation manuelle d'amorçage pour exécuter deux angulaire applications en même temps.

Aussi loin que je peux dire, il n'y a pas de différence lors de l'exécution entre une application avec ng-app sur <html> ou <body>. Comme je le comprends, ng-app désigne la racine de l'angulaire de l'application, de sorte que le placement de celui-ci sur l' <body> permettrait de réduire l' <head> de angulaire du champ d'application, mais je ne peux pas penser de tout façon cela aurait un impact sur les choses. Donc ma question est: Quelle est la différence technique entre les plaçant ng-app sur l'une de ces étiquettes à la place de l'autre?

144voto

Haralan Dobrev Points 2682

Il n'y a pas de grande différence où vous mettez ng-app .

Si vous le mettez sur <body> vous avez une marge plus petite pour AngularJS, ce qui est légèrement plus rapide.

Mais j'ai utilisé ng-app sur les <html> pour manipuler les <title> .

21voto

Peter Drinnan Points 1123

Je faisais partie d'une équipe travaillant sur une application héritée et j'ai trouvé qu'il était préférable d'utiliser la balise ng-app dans une div utilisée comme enveloppe pour isoler le nouveau code du code hérité.

Nous avons découvert cela en travaillant sur l'application qui s'appuyait fortement sur jqGrid et Dojo.

Lorsque nous avons ajouté ng-app à la balise head, le site a été éclaté, mais lorsque nous utilisions un wrapper, nous pouvions utiliser Angular sans aucun problème.

4voto

Noypi Points 177

AngularJS aura pour effet de démarrer la première ng-app il trouve! C'est tout. Si vous avez plus d'un ng-app, il ne traite que la première. Si vous voulez amorcer n'importe quel autre élément angulaire.bootstrap()

La valeur de la ng-app attribut est un module qui ont été créés à l'aide de:

angular.module("module_name", [])

Un module définit comment angulaire sera démarré parce que nous n'avons pas de méthode main() contrairement à d'autres langages de programmation. Si ng-app de la valeur est vide, la valeur par défaut est d'utiliser "ng", le module par défaut.

Il a été dit d'être un peu plus rapide car angulaire traitera tous les éléments à l'intérieur de l'élément où ng-app a été. Mais je doute légèrement en partie parce que la différence est à peine perceptible, à moins que vous avez une très très encombrant DOM.

Si vous souhaitez des exemples ici: http://noypi-linux.blogspot.com/2014/07/angularjs-tutorials-understanding.html

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X