我们知道由命令 ng new project-name,cli 将会创建一个基础的 angular 应用, 我们是可以直接运行起来一个应用. 这归功与 cli 已经给我们创建好了一个根模块 AppModule, 而根模块就是用来启动此应用的模块.
main.ts 是启动的起点, platformBrowserDynamic 这个函数是浏览器平台的工厂函数, 执行会返回浏览器平台的实例, 然后对根模块进行初始化, 链式的将所有的依赖的 Module 都给加载进来. 每个应用程序都是通过模块的 usingbootstrapModule 方法创建的.
- import { enableProdMode } from '@angular/core';
- import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
- import { AppModule } from './app/app.module';
- import { environment } from './environments/environment';
- if (environment.production) {
- enableProdMode();
- }
- // 首先创建平台, 然后创建应用程序实例.
- platformBrowserDynamic().bootstrapModule(AppModule)
- .catch(err => console.error(err));
创建应用程序时, Angular 会检查根模块 AppModule,AppModule 的属性 Bootstrap 用于引导应用程序. 此属性通常来来引导应用程序的组件. 然后 Angular 在 DOM 中找到作为自举组件的选择器的元素, 并初始化该组件. 大概就这样吧.
- import { BrowserModule } from '@angular/platform-browser';
- import { NgModule } from '@angular/core';
- import { AppRoutingModule } from './app-routing.module';
- import { AppComponent } from './app.component';
- @NgModule({
- declarations: [
- AppComponent
- ],
- imports: [
- BrowserModule,
- AppRoutingModule
- ],
- providers: [],
- Bootstrap: [AppComponent]
- })
- export class AppModule { }
来源: http://www.bubuko.com/infodetail-3394902.html