How do we load AngularJS at the end of the body instead of the header?

By default, the AngularJS function does not work unless I put it in <head>. Is there any way to put it at the end <body>instead?

My code is as follows:

$(document).ready(function() {
    var myApp = angular.module("myApp", []);

    myApp.bootstrap(document, ["myApp"]);

    myApp.controller("AppController",["$scope", "$http", function() {
        // so stuff with the $scope.
    }]);
});

EDIT 3/31/14: Based on ederollora's answer and some research, I found that the call angular.bootstrap()should be called after everything is defined. The above code becomes the following:

$(document).ready(function() {
    var myApp = angular.module("myApp", []);

    myApp.controller("AppController",["$scope", "$http", function() {
        // so stuff with the $scope.
    }]);

    myApp.bootstrap(document, ["myApp"]); // compile the app last
});

Also, in the interest of porting my application from jQuery to Angular, I am changing document.ready calls to the angular version:

angular.element(document).ready(function() {
    var myApp = angular.module("myApp", []);

    myApp.controller("AppController",["$scope", "$http", function() {
        // so stuff with the $scope.
    }]);

    myApp.bootstrap(document, ["myApp"]); // compile the app last
});

The documentation was not clear what angular.boostrap()needed to be called after defining everything, so I went and improved the documentation.

+4
1

AngularJS:

Angular

Angular , .

<!doctype html>
<html xmlns:ng="http://angularjs.org" ng-app>
  <body>
  ...
  <script src="angular.js">
  </body>
</html>

:

+4

Source: https://habr.com/ru/post/1534176/


All Articles