AngularJS dans HEAD vs BODY
Dans tous les exemples AngularJS, la bibliothèque Angular est placée dans les balises HEAD du document. J'ai un projet existant qui a été construit sur HTML5 Disposition de la chaudière. Ceci définit que les bibliothèques JS doivent être placées tout en bas du DOM avant le </BODY> tag.
AngularJS doit-il être placé dans la tête?
AngularJS n'a pas besoin d'être placé dans le HEAD, et en fait vous ne devriez pas normalement, car cela bloquerait le chargement du HTML.
Cependant, lorsque vous chargez AngularJS au bas de la page, vous devrez utiliser ng-cloak ou ng-bind pour éviter le "flash de contenu non compilé". Notez que vous avez seulement besoin d'utiliser ng-cloak/ng-bind sur votre page "index.html". Lorsque ng-include ou ng-view ou d'autres éléments Angular sont utilisés pour extraire du contenu supplémentaire après le chargement initial de la page, ce contenu sera compilé par Angular avant qu'il ne s'affiche.
Voir aussi https://stackoverflow.com/a/14076004/215945
Cette seule réponse sur Google Groupes m'a donné un aperçu parfait (raccourci):
Cela dépend vraiment du contenu de votre page de destination. Si la plupart sont statiques avec seulement quelques liaisons AngularJS que oui, je suis d'accord, le bas de la page est le meilleur. Mais dans le cas d'un contenu entièrement dynamique, vous souhaitez charger AngularJS ASAP [dans la tête].
Donc, si votre contenu est généré en grande partie via Angular, vous vous épargnerez le CSS supplémentaire et ng-cloak directives en incluant simplement Angular dans la tête.
https://groups.google.com/d/msg/angular/XTJFkQHjW5Y/pbSotoaqlkwJ
Le chargement de Angular en bas de la page entraîne un flash de laid {{quelque chose}} html. L'utilisation de la directive ng-cloak dans la balise body crée un flash vide jusqu'à ce que le JS soit chargé de sorte qu'il n'ajoute aucun avantage par rapport au chargement d'AngularJS dans l'élément head. Vous pouvez ajouter ng-cloak à chaque élément contenant des directives ng mais vous vous retrouverez avec un flash d'éléments vides. Soooo, chargez = Angular et vos fichiers app.js dans l'élément head comme la documentation Angular recommande dans cette citation de leur documentation: "Pour le meilleur résultat, le angular.js le script doit être chargé dans la section head du document html "
Pas nécessairement.
Veuillez jeter un œil à ceci http://plnkr.co/edit/zzt41VUgR332IV01KPsO?p=preview . Où le angular js est placé en bas de la page, et restitue toujours la même sortie s'il devait être placé en haut.