Cosa fa la funzione bootstrap in Angular 2

Question

Sono molto nuovo per i framework di frontend e sto imparando Angular 2. Nel tutorial, ti dice di includere la riga bootstrap(AppComponent). Cosa fa questa funzione di bootstrap? È semplicemente ciò che avvia l'app? Immagino che non abbia nulla a che fare con il framework UI twitter-bootstrap.

Answer 1

bootstrap è la funzione che indica al sistema Angular2 di eseguire il rendering del componente sulla pagina come componente principale.

Definisce anche il punto di entità dell'applicazione, specificando la radice dell'applicazione.

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

Ma sì si dovrebbe avere menzione che componente selettore su index.html pagina come

<my-component></my-component> 

Se si confronta questo con angolare 1, troverete ng-app direttiva che prende angular.module nome come input come ng-app="myApp" e rendere disponibile il componente del modulo per l'applicazione o la funzioneangular.bootstrap per avviare l'applicazione sulla pagina.

Answer 2

Da the docs:

si crea un'istanza di un'applicazione angolare specificando esplicitamente una componente da utilizzare come componente principale per l'applicazione tramite il metodo bootstrap().

Quindi sì, avvia solo l'applicazione.

Answer 3

bootstrap() inizializza un'applicazione angolare eseguendo (accanto ad altre)

• creazione della zona angolare,
• creando l'iniettore principale e
• fabbriche esecuzione fornito da APP_INITIALIZER
• istanziazione e aggiungendo la radice componente.

Answer 4

Fondamentalmente bootstrap() in angular2 dirci il punto di ingresso per l'applicazione molto similer a ng-app in 1.x angolare, si crea zona angolare per l'intera applicazione, In 1.x angolare potremmo usare la direttiva ng-app, e dargli un valore come ng-app="myApp" o utilizzare il metodo angular.bootstrap che consente il bootstrap asincrono.

Il luogo abbiamo bisogno di recuperare il metodo bootstrap è angular2/platform/navigatore

import {bootstrap} from 'angular2/platform/browser'; 
    ... Some Code stuff 

    bootstrap(AppComponent, [Common providers, or Global services, varibale etc]); 

anche noi possiamo iniettare GlobalServices, variabili che ci accingiamo a utilizzare in tutta l'applicazione al momento della bootstraping nostra app , così facendo non dobbiamo importarli ancora e ancora nei nostri componenti.

Answer 5

E ora in Angular5:

• The bootstrap array

si avvia l'applicazione dal bootstrapping radice AppModule. Tra le altre cose, il processo di bootstrap crea i componenti elencati nell'array bootstrap e inserisce ciascuno nel DOM del browser.

Ulteriori approfondimenti:

• Bootstrap in main.ts