angular 分離app.module.ts代碼

當項目足夠大時，app.module.ts 里import代碼太多了，所以要分離。

 

只需要把單獨模塊中的引用分開寫就好了：

 1 import { NgModule } from '@angular/core';
 2 import { CommonModule } from "@angular/common";//<--NgIf、NgFor等指令
 3 import { FormsModule } from "@angular/forms"; //<-- NgModel lives here 雙向綁定
 4 import { HeroesComponent } from './heroes.component'
 5 import { HeroDetailComponent } from './hero-detail.component';
 6 
 7 
 8 @NgModule({
 9     imports: [
10         CommonModule,
11         FormsModule
12     ],
13     declarations: [
14         HeroesComponent,
15         HeroDetailComponent
16     ]
17 })
18 
19 export class HeroModule { }

最開始一直報錯，是因為

主要是imports: []
不能寫下面的兩個componet
我多寫了。。有時想還是不夠明白原理。

然后在app.module.ts中import就好了。