码迷,mamicode.com
首页 > 其他好文 > 详细

Angular的启动过程

时间:2020-01-26 14:31:17      阅读:70      评论:0      收藏:0      [点我收藏+]

标签:工厂   工作记录   erro   module   返回   boot   组件   enable   创建   

      我们知道由命令 ng new project-name,cli将会创建一个基础的angular应用,我们是可以直接运行起来一个应用。这归功与cli已经给我们创建好了一个根模块AppModule,而根模块就是用来启动此应用的模块。

     main.ts 是启动的起点,platformBrowserDynamic这个函数是浏览器平台的工厂函数,执行会返回浏览器平台的实例,然后对根模块进行初始化,链式的将所有的依赖的Module都给加载进来。每个应用程序都是通过模块的using bootstrapModule方法创建的。

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 { }

此随笔乃本人学习工作记录,如有疑问欢迎在下面评论,转载请标明出处。

如果对您有帮助请动动鼠标右下方给我来个赞,您的支持是我最大的动力。

Angular的启动过程

标签:工厂   工作记录   erro   module   返回   boot   组件   enable   创建   

原文地址:https://www.cnblogs.com/huangenai/p/12216518.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!