angular2——八大組成

                                                                                                                                           Angular2

 

模塊

理解：

Angular 應用是模塊化的，而且 Angular 有本身的模塊系統，它被稱爲 Angular 模塊或 NgModules。

 

 

組件

組件是一個項目主幹，一個模塊由多個組件構成

模板

模板是一個html，

 

 

 

元數據

理解：

元數據告訴 Angular 如何處理一個類。

一個類只有加了元數據才能算一個組件

selector： CSS 選擇器，它告訴 Angular 在父級 HTML 中查找<hero-list>標籤，建立並插入該組件。 例如，若是應用的 HTML 包含<hero-list></hero-list>， Angular 就會把HeroListComponent的一個實例插入到這個標籤中。

templateUrl：組件 HTML 模板的模塊相對地址。

providers - 組件所需服務的依賴注入提供商數組。 這是在告訴 Angular：該組件的構造函數須要一個HeroService服務，這樣組件就能夠從服務中得到數據。

 

 

 

 

 

數據綁定

分析圖：

 

 

指令

1：自定義（組件型）指令

也能夠理解爲組件其實就是指令的一種，以下圖就是輪播圖的組件

 

2：屬性型指令

屬性型指令用於改變一個 DOM 元素的外觀或行爲。

<input [(ngModel)]="hero.name">

ngModel就是典型的屬性型指令，修改了參數的屬性值。

3：結構型指令

<li *ngFor="let hero of heroes"></li>

<app-hero-detail *ngIf="selectedHero"></app-hero-detail>

NgFor,ngIf,ngClass等等都屬於結構型指令

 

服務

依賴注入

理解：

它是一種編程模式，可讓類從外部源中得到它的依賴，而沒必要親自建立它們（至關於java中的new）。

「依賴注入」是提供類的新實例的一種方式，還負責處理好類所需的所有依賴。大多數依賴都是服務。 Angular 使用依賴注入來提供新組件以及組件所需的服務。

Angular 經過查看構造函數的參數類型得知組件須要哪些服務

注入器維護了一個服務實例的容器，存放着之前建立的實例。 若是所請求的服務實例不在容器中，

注入器就會建立一個服務實例，而且添加到容器中，而後把這個服務返回給 Angular。 當全部請求的服務都被解析完並返回時，

Angular 會以這些服務爲參數去調用組件的構造函數。 這就是依賴注入 。

管道（pipe）

理解：

每一個應用開始的時候差很少都是一些簡單任務：獲取數據、轉換它們，而後把它們顯示給用戶

內置管道：

Angular內置了一些管道，好比DatePipe、UpperCasePipe、LowerCasePipe、CurrencyPipe和PercentPipe。 它們全均可以直接用在任何模板中。

自定義管道：

需求：在html中把靜態的字符串抽取出來，放到json中，方便修改，須要用到自定義的管道來轉化字符串。