1. 程式人生 > >Angular 2架構知識概解

Angular 2架構知識概解

1,模組(module):可執行單個任務的程式碼塊,用export指明其為一個模型,定義為public,可為整個應用程式引用

2,元件,元件是具有模板的控制器類,主要處理頁面上的應用程式和邏輯的檢視。 它是一個可以在整個應用程式中使用的程式碼。註冊時使用 @Component 註釋。表明其是一個元件。

3,模板:定義元件的檢視,該模板告訴Angular如何顯示元件,在插值大括號中放置模板表示式{{ }}顯示該值

4,資料繫結:是通過宣告源和目標HTML元素之間的繫結來協調應用程式資料值的過程。 它將模板部分與元件部分和模板HTML組合,使用標記繫結以連線兩側。 有四種類型的資料繫結:

  • 插值:它顯示div標籤中的元件值。

  • 屬性繫結:將屬性從父級屬性傳遞給子級的屬性。

  • 事件繫結:當您單擊元件方法名稱時觸發。

  • 雙向繫結:[(ngModel)] 是 Angular 的雙向資料繫結語法。資料繫結是模型和檢視元件之間的資料同步。 要顯示元件屬性,可以將其名稱放在檢視模板中,用雙花括號括起來。 雙向資料繫結使用指令 ngModel 合併單個符號中的屬性和事件繫結。

5,服務是服務是在多個“互相不知道”的類之間共享資訊的好辦法,僅負責執行特定任務的JavaScript函式。 角度服務使用依賴注入機制注入。 服務包括應用程式所需的值,功能或功能。 一般來說,服務是一個類,它可以執行某些特定的事情,如日誌服務,資料服務,訊息服務,應用程式的配置等。在Angular中沒有什麼關於服務,並且沒有ServiceBase類,但仍然服務可以被視為 基本的角度應用。

6,指令:該偽指令是表示元資料的類。 有三種類型的指令:

  • 元件指令:它使用檢視和控制器建立自定義控制器,並用作自定義HTML元素。

  • 裝飾指令:它使用額外的行為裝飾元素。

  • 模板指令:它將HTML轉換為可重用的模板。

7,依賴注入:是一種將物件作為應用程式中不同元件中的依賴關係傳遞的設計模式。 它建立一個新的類的例項及其所需的依賴項。

使用依賴注入時,必須記住以下幾點:

  • 依賴注入被刺激到框架中,並且可以在任何地方使用。

  • 注入器機制維護服務例項,並且可以使用提供者建立。

  • 提供者是建立服務的一種方式。

  • 您可以與注入器一起註冊提供程式。

8,管道:是格式化字串,金額,日期和其他顯示資料的好辦法

9,元資料:Angular 需要知道如何把應用程式的各個部分組合到一起,以及該應用需要哪些其它檔案和庫。 這些資訊被稱為元資料(metadata)

10,路由

路由定義 會告訴路由器,當用戶點選某個連結或者在瀏覽器位址列中輸入某個 URL 時,要顯示哪個檢視。

典型的 Angular 路由(Route)有兩個屬性:

  1. path:一個用於匹配瀏覽器位址列中 URL 的字串。

  2. component:當導航到此路由時,路由器應該建立哪個元件。

*ngFor 是一個 Angular 的複寫器(repeater)指令。 它會為列表中的每項資料複寫它的宿主元素。

使用*ngIf 隱藏空白的詳情。(來根據條件包含或排除了一段 HTML。)

主從元件:@Input()裝飾器