skip to Main Content

I’m very new to frontend frameworks and I am learning Angular 2. In the tutorial, it tells you to include the line bootstrap(AppComponent). What does this bootstrap function do? Is it simply what starts the app? I’m guessing it has nothing to do with the UI framework.

5

Answers


  1. bootstrap is the function which tells Angular2 system to render component over page as main component.

    Also defines entity point of your application, by specifying root of your application.

    //basically array will have dependencies of shared component which will instantiate only once.
    bootstrap(MyComponent, [SharedService, OtherComponent, ROUTING_DIRECTIVES]); 
    

    But yes you should have mention that component selector over index.html page like

    <my-component></my-component>
    

    If you compare this with Angular 1, you will find ng-app directive which takes angular.module name as an input like ng-app="myApp" and make available those module component for that application OR angular.bootstrap function to kick off application over the page.

    Login or Signup to reply.
  2. From the docs:

    You instantiate an Angular application by explicitly specifying a component to use as the root component for your application via the bootstrap() method.

    So yes, it just starts the application.

    Login or Signup to reply.
  3. bootstrap() initializes an Angular application by executing (beside others)

    • creating the Angular zone,
    • creating the root injector and
    • executing factories provided by APP_INITIALIZER
    • instantiating and adding the root component.
    Login or Signup to reply.
  4. Basically bootstrap() in angular2 tell us the Entry point for the app very similer to ng-app in angular 1.x, it creates angular zone for the whole app,In Angular 1.x we could use the ng-app Directive, and give it a value such as ng-app="myApp", or use the angular.bootstrap method which allows for asynchronous bootstrapping.

    The place we need to fetch the bootstrap method is angular2/platform/browser

      import {bootstrap} from 'angular2/platform/browser';
      ... Some Code stuff
    
      bootstrap(AppComponent, [Common providers, or Global services, varibale etc]);
    

    also we can inject GlobalServices, variables which we are going to use in the whole app at the time of bootstraping our app,
    by doing so we dont nees to imports those again and again in our components.

    Login or Signup to reply.
  5. And now in Angular5:

    You launch the application by bootstrapping the root AppModule. Among other things, the bootstrapping process creates the component(s) listed in the bootstrap array and inserts each one into the browser DOM.

    Further reading:

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search