What is manual bootstrap process in AngularJS?

Technology CommunityCategory: AngularJSWhat is manual bootstrap process in AngularJS?
VietMX Staff asked 3 years ago

You can manually initialized your angular app by using angular.bootstrap() function. This function takes the modules as parameters and should be called within angular.element(document).ready() function. The angular.element(document).ready() function is fired when the DOM is ready for manipulation.

<html>
<body>
    <div ng-controller="Ctrl">
Hello {{msg}}! </div>
    <script src="lib/angular.js"></script>
    <script>
        var app = angular.module('myApp', []);
        app.controller('Ctrl', function ($scope) {
              $scope.msg = 'World';
          });
        //manual bootstrap process
angular.element(document).ready(function () { angular.bootstrap(document, ['myApp']);
});
    </script>
</body>
</html>

Note:

  • You should not use the ng-app directive when manually bootstrapping your app.
  • You should not mix up the automatic and manual way of bootstrapping your app.
  • Define modules, controller, services etc. before manually bootstrapping your app as defined in above example.