Bootstrapping: It is a process of initializing angular in our application, bootstrapping is must to build any angular app and this is a first step for AngularJs Implementation.
We can do bootstrapping by two ways:
1) Manual Bootstrapping
If you need to have more control over initialization process then manual bootstrapping can be used.
angular.bootstrap(element [,modules]) api is used for manual bootstrapping.
Parameters needs to pass->
element : DOM element which is root of angular application.
[,modules] : Array of modules load in application.
Returns->
Returns the newly created injector for this app. (AUTO.$injector)
Manual bootstrapping can be done inside this statement
angular.element(document).ready(function() {
angular.bootstrap(element [,modules]);
})
* We will look into modules in our next lesson
Use below url to have a look, over manual bootstrapping process.
http://plnkr.co/edit/iop60YMInu7XxUOJfhOj
2) Automatic Bootstrapping.
a) "ng-app" is a directive used for automatically bootstrapping of application, by just placing this directive inside html tag, it will directly initialize angular for that page. As shown below.
<html lang="en" ng-app>
</html>
b) We can also assign modules to ng-app as shown below. But this module name is optional and with the help of this module we can inject multiple libraries.
<html lang="en" ng-app="MyFirstOptionalModule">
</html>
For about module knowledge please click here.
for IE7 this can be used <html ng-app id="ng-app">
We can do bootstrapping by two ways:
1) Manual Bootstrapping
If you need to have more control over initialization process then manual bootstrapping can be used.
angular.bootstrap(element [,modules]) api is used for manual bootstrapping.
Parameters needs to pass->
element : DOM element which is root of angular application.
[,modules] : Array of modules load in application.
Returns->
Returns the newly created injector for this app. (AUTO.$injector)
Manual bootstrapping can be done inside this statement
angular.element(document).ready(function() {
angular.bootstrap(element [,modules]);
})
* We will look into modules in our next lesson
Use below url to have a look, over manual bootstrapping process.
http://plnkr.co/edit/iop60YMInu7XxUOJfhOj
2) Automatic Bootstrapping.
If the
ng-app directive is found then Angular will:- load the module associated with the directive.
- create the application
injector - compile the DOM treating the
ng-appdirective as the root of the compilation.
a) "ng-app" is a directive used for automatically bootstrapping of application, by just placing this directive inside html tag, it will directly initialize angular for that page. As shown below.
<html lang="en" ng-app>
</html>
b) We can also assign modules to ng-app as shown below. But this module name is optional and with the help of this module we can inject multiple libraries.
<html lang="en" ng-app="MyFirstOptionalModule">
</html>
For about module knowledge please click here.
for IE7 this can be used <html ng-app id="ng-app">
No comments:
Post a Comment