模組（NgModule）

繼學習筆記14，可以大概的知道Angular的大概架構，現在在一一深入瞭解。

Angular的應用，會將整個應用進行模組化處理，即：將一個應用分成幾個模組，一個應用，至少有一個模組（AppModule-根模組），簡答的講，一個模組，就是一個容器，存放一些內聚的程式碼塊，這些程式碼塊專注於某個應用領域、某個工作流或一組緊密相關的功能。 它可以包含一些元件、服務提供商或其它程式碼檔案，其作用域由包含它們的 NgModule 定義。 它還可以匯入一些由其它模組中匯出的功能，並匯出一些指定的功能供其它 NgModule 使用。

每個 Angular 應用都至少有一個 NgModule 類，也就是

每個 Angular 應用都至少有一個 NgModule 類，也就是根模組，它習慣上命名為 AppModule，並位於一個名叫 app.module.ts 的檔案中。引導這個根模組就可以啟動你的應用。

雖然小型的應用可能只有一個 NgModule，不過大多數應用都會有很多特性模組

@NgModule 元資料

NgModule 是一個帶有 @NgModule 裝飾器的類。@NgModule 裝飾器是一個函式，它接受一個元資料物件，該物件的屬性用來描述這個模組。其中最重要的屬性如下。

• declarations（可宣告物件表） —— 那些屬於本 NgModule 的元件、指令、管道。

• exports（匯出表） —— 那些能在其它模組的元件模板中使用的可宣告物件的子集。

• imports（匯入表） —— 那些匯出了本模組中的元件模板所需的類的其它模組。

• providers —— 本模組向全域性服務中貢獻的那些服務的建立器。 這些服務能被本應用中的任何部分使用。（你也可以在元件級別指定服務提供商，這通常是首選方式。）

• bootstrap —— 應用的主檢視，稱為根元件。它是應用中所有其它檢視的宿主。只有根模組才應該設定這個 bootstrap 屬性。

NgModule 和元件

NgModule 為其中的元件提供了一個編譯上下文環境。根模組總會有一個根元件，並在引導期間建立它。 但是，任何模組都能包含任意數量的其它元件，這些元件可以通過路由器載入，也可以通過模板建立。那些屬於這個 NgModule 的元件會共享同一個編譯上下文環境。元件及其模板共同定義檢視。元件還可以包含檢視層次結構，它能讓你定義任意複雜的螢幕區域，可以將其作為一個整體進行建立、修改和銷燬。 一個檢視層次結構中可以混合使用由不同 NgModule 中的元件定義的檢視。 這種情況很常見，特別是對一些 UI 庫來說。

當你建立一個元件時，它直接與一個叫做宿主檢視的檢視關聯起來。 宿主檢視可以是檢視層次結構的根，該檢視層次結構可以包含一些內嵌檢視，這些內嵌檢視又是其它元件的宿主檢視。 這些元件可以位於相同的 NgModule 中，也可以從其它 NgModule 中匯入。 樹中的檢視可以巢狀到任意深度。

NgModule 和 JavaScript 的模組

NgModule 系統與 JavaScript（ES2015）用來管理 JavaScript 物件的模組系統不同，而且也沒有直接關聯。 這兩種模組系統不同但互補。你可以使用它們來共同編寫你的應用。

JavaScript 中，每個檔案是一個模組，檔案中定義的所有物件都從屬於那個模組。 通過 export 關鍵字，模組可以把它的某些物件宣告為公共的。 其它 JavaScript 模組可以使用import 語句來訪問這些公共物件。

(部分摘自Angular官網)