
.l-main-section
  h2(class="function export") bootstrap

  p <code>(appComponentType: Type, componentInjectableBindings: List&lt;Binding&gt; = null, errorReporter: Function = null)</code>

  p.location-badge.
    exported from <a href="/angular2/core.html">angular2/core</a>

  :markdown
    Bootstrapping for Angular applications.
    
    You instantiate an Angular application by explicitly specifying a component to use as the root component for your
    application via the `bootstrap()` method.
    
    ## Simple Example
    
    Assuming this `index.html`:
    
    ```html
    <html>
      <!-- load Angular script tags here. -->
      <body>
        <my-app>loading...</my-app>
      </body>
    </html>
    ```
    
    An application is bootstrapped inside an existing browser DOM, typically `index.html`. Unlike Angular 1, Angular 2
    does not compile/process bindings in `index.html`. This is mainly for security reasons, as well as architectural
    changes in Angular 2. This means that `index.html` can safely be processed using server-side technologies such as
    bindings. Bindings can thus use double-curly `{{ syntax }}` without collision from Angular 2 component double-curly
    `{{ syntax }}`.
    
    We can use this script code:
    
    ```
    @Component({
       selector: 'my-app'
    })
    @View({
       template: 'Hello {{ name }}!'
    })
    class MyApp {
      name:string;
    
      constructor() {
        this.name = 'World';
      }
    }
    
    main() {
      return bootstrap(MyApp);
    }
    ```
    
    When the app developer invokes `bootstrap()` with the root component `MyApp` as its argument, Angular performs the
    following tasks:
    
     1. It uses the component's `selector` property to locate the DOM element which needs to be upgraded into
        the angular component.
     2. It creates a new child injector (from the platform injector) and configures the injector with the component's
        `injectables`. Optionally, you can also override the injector configuration for an app by invoking
        `bootstrap` with the `componentInjectableBindings` argument.
     3. It creates a new `Zone` and connects it to the angular application's change detection domain instance.
     4. It creates a shadow DOM on the selected component's host element and loads the template into it.
     5. It instantiates the specified component.
     6. Finally, Angular performs change detection to apply the initial data bindings for the application.
    
    
    ## Instantiating Multiple Applications on a Single Page
    
    There are two ways to do this.
    
    
    ### Isolated Applications
    
    Angular creates a new application each time that the `bootstrap()` method is invoked. When multiple applications
    are created for a page, Angular treats each application as independent within an isolated change detection and
    `Zone` domain. If you need to share data between applications, use the strategy described in the next
    section, "Applications That Share Change Detection."
    
    
    ### Applications That Share Change Detection
    
    If you need to bootstrap multiple applications that share common data, the applications must share a common
    change detection and zone. To do that, create a meta-component that lists the application components in its template.
    By only invoking the `bootstrap()` method once, with the meta-component as its argument, you ensure that only a
    single change detection zone is created and therefore data can be shared across the applications.
    
    
    ## Platform Injector
    
    When working within a browser window, there are many singleton resources: cookies, title, location, and others.
    Angular services that represent these resources must likewise be shared across all Angular applications that
    occupy the same browser window.  For this reason, Angular creates exactly one global platform injector which stores
    all shared services, and each angular application injector has the platform injector as its parent.
    
    Each application has its own private injector as well. When there are multiple applications on a page, Angular treats
    each application injector's services as private to that application.
    
    
    # API
    - `appComponentType`: The root component which should act as the application. This is a reference to a `Type`
      which is annotated with `@Component(...)`.
    - `componentInjectableBindings`: An additional set of bindings that can be added to `injectables` for the
    <a href='../annotations/Component-class.html'><code>Component</code></a> to override default injection behavior.
    - `errorReporter`: `function(exception:any, stackTrace:string)` a default error reporter for unhandled exceptions.
    
    Returns a `Promise` with the application`s private <a href='../di/Injector-class.html'><code>Injector</code></a>.
    


