CODEWITHSUNDEEP
htmlangularjs
Energetic Pixels
Energetic Pixels

Reputation: 383

position within html for angular <script> tag

I have been handed a project that will combine CodeIgniter with AngularJS. Since i have no real world exp. with angular, I have been going through the tuts. I have noticed sporadic issues with where the html script tag that locates the angular.js file. Some of the tutorials have the script tag within the html tag and some of the tuts have the script tag down at the bottom (before the closing tag). When inserted within the head tag, it works every time. But when placed down at the bottom, my tut app has issues. Like it wont recognize the {{variable}} and do what its supposed to. Should angular work at both locations?? I was always taught that the only javascript reference that goes in the head is Respond.js and the modernizr.js. Everything else can be located at the bottom of the html page I am using the most recent stable version of angular.

Tony

Upvotes: 4

Views: 1679

Answers (2)

Mik378
Mik378

Reputation: 22171

You can choose the way you want, since it's a SPA => loaded once so no poor performance if in head.

If you declare angular.json the bottom part of the page, there's a good way to avoid the case for missed interpolated variable:
You should use the ng-bind directive in your home template instead of the direct interpolation notation:

<div ng-bind="model.value"></div>

instead of {{model.value}}

Upvotes: 3

Remco Haszing
Remco Haszing

Reputation: 7809

You should place it just before the closing body tag. This way the JavaScript is executed after loading the html.

Upvotes: 0

Related Questions