看過Angular的官方文檔就會發(fā)現(xiàn)，創(chuàng)建一個(gè)angular項(xiàng)目，只需一下兩條命令：

npm install -g @angular/cli
ng new project-name

而讓這個(gè)項(xiàng)目運(yùn)行起來也是兩條命令：

cd project-name
npm start --open

此時(shí)你已經(jīng)可以看到下面這樣的一個(gè)頁面了吧??

image.png

那么今天主要介紹app.module.ts 這個(gè)文件中有什么：

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
  ],
  exports: [],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

前面的import和后面的export就不多說了。

• @NgModule：Angular 的基本構(gòu)造塊，為組件提供上下文。

• declaration(可聲明的對象)：用于聲明屬于本模塊的組件，服務(wù)，管道。此時(shí)我們的AppModule里只有一個(gè)AppComponet聲明在這里。

• imports(導(dǎo)入表)：本模塊需要依賴的其他模塊。由于在創(chuàng)建項(xiàng)目的時(shí)候選擇了路由，所以我們的項(xiàng)目是依賴于AppRouteringModule的。

• exports(導(dǎo)出表)：本模塊中的組件需要在其他組件中使用，

• providers：本模塊向全局服務(wù)中貢獻(xiàn)的那些服務(wù)創(chuàng)建器。這些服務(wù)可以在本模塊的任何地方被使用。例如，

• bootstrap：應(yīng)用的主視圖，也就是跟組件。只有根模塊才應(yīng)該設(shè)置bootstrap屬性。而我們當(dāng)前項(xiàng)目的根模塊也就是AppModule。