《揭秘Angular（第2版）》
ng領域旗艦 谷歌指定用書 全面擁抱新版 原理|源碼|實戰系統覆蓋
廣發證券網際網路金融技術團隊 著
ISBN 978-7-121-34272-1
2018年7月出版
定價：118.00元
576頁
16開
基本介紹
- 書名：揭秘Angular（第2版）
- 作者：廣發證券網際網路金融技術團隊
- ISBN：978-7-121-34272-1
- 頁數：576頁
- 定價：118.00元
- 出版社：電子工業出版社
- 出版時間：2018.7
- 裝幀：平裝
- 開本：16開
編輯推薦
√ 本書為谷歌開發者社區官方指定用書，由谷歌Angular技術開發團隊作序力薦。
√ 目前市面上絕無僅有的基於Angular 4系統全面介紹這一技術方方面面的書籍。
√ 本書作者團隊從Angular早期版本問世以來即投入生產實踐，積累豐富實戰經驗。
√ 首版問世後飽受好評，國內一線前端團隊及技術社區資深專家集體亮相盛讚。
內容提要
作為一部系統講解流行前端框架Angular 新版的權威著作，《揭秘Angular（第2版）》覆蓋入門、深入和實戰三大主題。第一部分從前端的故事起點說起，然後對Angular 及TypeScript 進行了簡單的介紹，接著通過一個通訊錄例子讓讀者快速入門Angular 的開發；第二部分深入講解了Angular 架構及Angular 核心內容，包括組件、模板、指令、服務、依賴注入、路由及測試，此外，在相應的章節里還補充說明了如變化監測的核心Zones（第6 章）、雙向綁定的原理（第7 章）、RxJS（第9 章）等關鍵內容；第三部分則通過問卷調查系統來指引讀者進行Angular 項目的實戰；第四部分主要是Angular 延伸知識的講解，介紹了ionic 框架（第19 章）及Angular 的服務端渲染（第20 章）相關技術。
目錄
第一部分入門篇
1 前端風雲 2
1.1 故事的起點 2
1.2 AJAX 王者歸來 3
1.3 工具庫的流行 3
1.4 百家爭鳴 3
1.5 走進前端新時代 4
1.6 小結 6
2 Angular 簡介 7
2.1 歷史回顧 7
2.1.1 AngularJS 1.x 起源 7
2.1.2 AngularJS 1.x 疊代之路 8
2.1.3 初生的Angular 9
2.1.4 快速發展的Angular 10
2.1.5 Angular 4 和後續語義版本 11
2.1.6 開發語言之選 13
2.2 Angular 簡述 14
2.2.1 核心概念 14
2.2.2 平台簡介 16
2.2.3 平台亮點 18
2.3 小結 19
3 TypeScript 入門 20
3.1 TypeScript 概述 20
3.1.1 概述 20
3.1.2 安裝 21
3.2 基本類型 22
3.2.1 布爾類型 22
3.2.2 數字類型 22
3.2.3 字元串類型 23
3.2.4 數組類型 23
3.2.5 元組類型 23
3.2.6 枚舉類型 23
3.2.7 任意值類型 24
3.2.8 null 和undefined 24
3.2.9 void 類型 25
3.2.10 never 類型 26
3.3 聲明和解構 26
3.3.1 let 聲明 27
3.3.2 const 聲明 28
3.3.3 解構 28
3.4 函式 30
3.4.1 函式定義 30
3.4.2 可選參數 30
3.4.3 默認參數 31
3.4.4 剩餘參數 32
3.4.5 函式重載 32
3.4.6 箭頭函式 33
3.5 類 34
3.5.1 類的例子 34
3.5.2 繼承與多態 34
3.5.3 修飾符 35
3.5.4 參數屬性 37
3.5.5 靜態屬性 37
3.5.6 抽象類 38
3.6 模組 39
3.6.1 概述 39
3.6.2 模組導出方式 39
3.6.3 模組導入方式 40
3.6.4 模組的默認導出 41
3.6.5 模組設計原則 42
3.7 接口 44
3.7.1 概述 44
3.7.2 屬性類型接口 44
3.7.3 函式類型接口 45
3.7.4 可索引類型接口 46
3.7.5 類類型接口 46
3.7.6 接口擴展 47
3.8 裝飾器 48
3.8.1 概述 48
3.8.2 方法裝飾器 49
3.8.3 類裝飾器 50
3.8.4 參數裝飾器 52
3.8.5 屬性裝飾器 53
3.8.6 裝飾器組合 53
3.9 泛型 55
3.10 TypeScript 周邊 56
3.10.1 編譯配置檔案 56
3.10.2 聲明檔案 57
3.10.3 編碼工具 58
3.10.4 展望未來 59
3.11 小結 59
4 快速入門 60
4.1 Hello World 例子 60
4.1.1 準備工作 60
4.1.2 構建項目 61
4.2 通訊錄例子 66
4.2.1 背景介紹 66
4.2.2 架構設計 68
4.3 小結 74
第二部分深入篇
5 Angular 架構總覽 76
5.1 核心模組介紹 76
5.1.1 組件 77
5.1.2 模板 81
5.1.3 指令 83
5.1.4 服務 84
5.1.5 依賴注入 84
5.1.6 路由 86
5.2 套用模組 89
5.3 源碼結構介紹 92
5.4 小結 93
6 組件 94
6.1 概述 94
6.1.1 模組化介紹 94
6.1.2 組件化標準 96
6.1.3 Angular 的組件 99
6.2 組件基礎 100
6.2.1 創建組件的步驟 100
6.2.2 組件的基礎構成 101
6.2.3 組件與模組 108
6.3 組件互動 113
6.3.1 組件的輸入、輸出屬性 113
6.3.2 父組件向子組件傳遞數據 114
6.3.3 子組件向父組件傳遞數據 120
6.3.4 其他組件互動方式 121
6.4 組件內容嵌入 124
6.5 組件生命周期 128
6.5.1 概述 128
6.5.2 生命周期鉤子 128
6.6 變化監測 130
6.6.1 數據變化的源頭 131
6.6.2 變動通知機制 132
6.6.3 變化監測的回響處理 134
6.7 擴展閱讀 140
6.7.1 元數據一覽表 140
6.7.2 元數據說明 141
6.7.3 深入理解Zone.js 150
6.7.4 不依賴Zone.js 的Angular 154
6.8 小結 155
7 模板 156
7.1 模板語法概覽 156
7.2 數據綁定 158
7.2.1 概述 158
7.2.2 插值 160
7.2.3 模板表達式 160
7.2.4 屬性綁定 162
7.2.5 事件綁定 165
7.2.6 雙向數據綁定 168
7.2.7 輸入和輸出屬性 169
7.3 內置指令 170
7.3.1 NgClass 170
7.3.2 NgStyle 170
7.3.3 NgIf 171
7.3.4 NgSwitch 172
7.3.5 NgFor 172
7.4 表單 173
7.4.1 模板表單例子 174
7.4.2 表單指令 175
7.4.3 自定義表單樣式 184
7.4.4 表單校驗 186
7.5 管道 189
7.5.1 管道介紹 189
7.5.2 內置管道 190
7.5.3 自定義管道 196
7.5.4 管道的變化監測 198
7.6 擴展閱讀 202
7.6.1 安全導航操作符 202
7.6.2 雙向綁定的原理 202
7.7 小結 204
8 指令 206
8.1 概述 206
8.1.1 指令分類 208
8.1.2 內置指令 210
8.2 自定義屬性指令 219
8.2.1 實現屬性指令 219
8.2.2 為指令綁定輸入 221
8.2.3 回響用戶操作 223
8.3 自定義結構指令 224
8.3.1 實現結構指令 225
8.3.2 模板標籤與星號前綴 227
8.3.3 NgIf 指令原理 229
8.4 擴展閱讀 231
8.5 小結 235
9 服務與RxJS 237
9.1 Angular 服務 237
9.1.1 概述 237
9.1.2 使用場景 238
9.2 HTTP 服務 242
9.2.1 HttpModule 242
9.2.2 HttpClientModule 254
9.3 回響式編程 262
9.3.1 概述 262
9.3.2 ReactiveX 264
9.4 RxJS 266
9.4.1 創建Observable 對象 266
9.4.2 使用RxJS 處理複雜場景 266
9.4.3 RxJS 和Promise 的對比 267
9.4.4 “冷”模式下的Observable 268
9.4.5 RxJS 中的Operator 269
9.4.6 Angular 中的RxJS 273
9.5 小結 277
10 依賴注入 278
10.1 依賴注入介紹 279
10.2 Angular 依賴注入 282
10.2.1 概述 282
10.2.2 在組件中注入服務 285
10.2.3 在服務中注入服務 287
10.2.4 在模組中注入服務 288
10.2.5 層級注入 290
10.2.6 注入到派生組件 295
10.2.7 限定方式的依賴注入 297
10.3 Provider 300
10.3.1 概述 300
10.3.2 Provider 註冊方式 302
10.4 擴展閱讀 305
10.5 小結 308
11 路由 309
11.1 概述 309
11.2 基本用法 311
11.2.1 路由配置 311
11.2.2 創建根路由模組 312
11.2.3 添加RouterOutlet 指令 312
11.3 路由策略 313
11.3.1 HashLocationStrategy 介紹 314
11.3.2 PathLocationStrategy 介紹 315
11.4 路由跳轉 316
11.4.1 使用指令跳轉 317
11.4.2 使用代碼跳轉 319
11.5 路由參數 321
11.5.1 Path 參數 321
11.5.2 Query 參數 324
11.5.3 Matrix 參數 326
11.6 子路由和附屬Outlet 326
11.6.1 子路由 326
11.6.2 附屬Outlet 328
11.7 路由攔截 330
11.7.1 激活攔截與反激活攔截 330
11.7.2 數據預載入攔截 334
11.8 模組的延遲載入 337
11.8.1 延遲載入實現 337
11.8.2 模組預載入 339
11.8.3 模組載入攔截 341
11.9 小結 342
12 測試 343
12.1 概述 343
12.2 單元測試 344
12.2.1 概述 344
12.2.2 常用測試框架 345
12.2.3 Jasmine 介紹 345
12.2.4 Karma 介紹 350
12.2.5 Karma 結合Jasmine 測試 350
12.3 Angular 單元測試 355
12.3.1 概述 355
12.3.2 獨立單元測試 358
12.3.3 測試工具集 362
12.4 端到端測試 370
12.4.1 概述 370
12.4.2 Protractor 介紹 371
12.5 小結 374
第三部分實戰篇
13 問卷調查系統簡介 376
13.1 項目背景 376
13.2 主要特性 377
13.2.1 首頁和幫助頁 378
13.2.2 問卷編輯頁 378
13.2.3 我的問卷頁 378
13.2.4 用戶管理頁 379
13.3 產品設計 379
13.4 小結 380
14 項目起步 381
14.1 Angular CLI 381
14.1.1 簡介 381
14.1.2 常用命令介紹 382
14.2 其他技術選型 391
14.2.1 UI 樣式庫 391
14.2.2 後端伺服器 391
14.3 環境搭建 392
14.3.1 搭建前端環境 392
14.3.2 引入樣式庫 393
14.3.3 搭建後端環境 394
14.4 目錄結構介紹 396
14.5 首頁開發 397
14.6 導航欄開發 401
14.7 小結 402
15 問卷編輯模組 403
15.1 概述 403
15.1.1 特性管理模組 403
15.1.2 功能設計 406
15.1.3 數據模型 407
15.2 問卷編輯模組開發 410
15.2.1 問題選擇組件 410
15.2.2 問題組件 414
15.2.3 問卷組件 425
15.2.4 問卷服務 431
15.2.5 問卷大綱組件 438
15.3 小結 441
16 我的問卷模組 442
16.1 問卷列表 443
16.1.1 問卷列表項 443
16.1.2 顯示問卷列表 445
16.1.3 顯示問卷詳情 447
16.2 問卷操作 449
16.2.1 發布後的問卷頁面 450
16.2.2 問卷操作組件 453
16.3 小結 456
17 用戶管理模組 457
17.1 開發簡單註冊頁 458
17.2 表單控制項組件 460
17.2.1 定義表單控制項 460
17.2.2 校驗表單控制項 461
17.2.3 表單安全 464
17.3 用戶註冊功能開發 465
17.3.1 用戶註冊服務 465
17.3.2 組件的邏輯 466
17.3.3 註冊接口開發 469
17.4 許可權管理 470
17.5 小結 473
18 項目構建和最佳實踐 475
18.1 項目構建 475
18.1.1 代碼質量檢查 475
18.1.2 測試 476
18.1.3 打包 478
18.1.4 容器化 479
18.2 最佳實踐 479
18.2.1 單一職責 480
18.2.2 命名約定 480
18.2.3 編碼約定 483
18.2.4 Angular 模組約定 487
18.2.5 組件相關約定 487
18.2.6 指令相關約定 489
18.2.7 服務相關約定 490
18.2.8 其他 491
18.3 小結 492
第四部分延伸篇
19 移動開發框架：ionic 介紹與實戰 494
19.1 移動開發 494
19.1.1 背景介紹 494
19.1.2 四種開發模式 495
19.1.3 技術選型 495
19.2 ionic 平台介紹 496
19.2.1 概覽 496
19.2.2 Cordova 498
19.2.3 環境搭建 499
19.2.4 組件開發 501
19.2.5 路由和導航 503
19.3 ionic Native 507
19.3.1 外掛程式介紹 507
19.3.2 外掛程式使用 508
19.3.3 外掛程式開發 509
19.4 樣式和主題 509
19.4.1 平台樣式 509
19.4.2 主題 511
19.4.3 全局變數 512
19.4.4 工具屬性 513
19.4.5 Iconfont 514
19.5 ionic CLI 515
19.6 通訊錄實例 518
19.6.1 項目搭建 519
19.6.2 主頁面 520
19.7 小結 525
20 服務端渲染 527
20.1 概述 527
20.2 客戶端渲染的局限性 528
20.3 服務端渲染的局限性 529
20.4 Angular Universal 介紹 531
20.5 將通訊錄例子改造成Angular Universal 的方式 533
20.6 服務端渲染的進階實踐 540
20.6.1 服務端數據的同步 541
20.6.2 使用依賴注入解決環境差異 544
20.6.3 使用Preboot 解決事件脫節 546
20.7 小結 549
作者簡介
廣發證券網際網路金融技術團隊，是早期擁抱 Angular 的堅定踐行者。作為全新一代的證券業 IT 研發組織，團隊致力於用最新最好的技術打造行業方案、支持業務創新。我們熱愛開源技術、信奉敏捷方法、編寫優雅代碼、關注用戶體驗，我們喜歡網際網路工程師文化，我們在技術創新中尋找到樂趣。
前言
2016 年9 月15 日，Angular 橫空出世。鑒於Angular 1.x 的巨大成功，加上Angular自身超前而顛覆式的設計，使其市場關注度水漲船高。本書是一本幫助讀者對Angular進行快速了解、深入熟悉並用其進行實戰開發的書籍。
本書概述
本書主要分為入門篇、深入篇、實戰篇和延伸篇四大部分，總共20 個章節。
第一部分：從第1 章到第4 章，主要講述整個前端發展史的演進；Angular 的發展歷程、核心概念及周邊工具的簡單介紹；快速熟悉Angular 官方推薦的開發語言TypeScript；最後以一個通訊錄示例介紹如何搭建開發環境並快速上手Angular。
第二部分：從第5 章到第12 章，主要圍繞通訊錄示例深入講解Angular 的相關知識點，包括Angular 的運行機理與整體架構介紹、組件與變化監測相關內容、模板與管道、指令的總體介紹、服務與回響式編程RxJS、強大的依賴注入、靈活高可用的路由機制等，最後介紹了在項目開發中與測試相關的內容。
第三部分：從第13 章到第18 章，主要以實現一個問卷調查系統為目標，闡述如何使用Angular 進行項目實戰。主要內容包括項目背景介紹、開發環境的搭建、整體技術架構分析、用戶管理及問卷編輯等頁面的實現細節等，最後講解了項目的構建流程及最佳實踐。
第四部分：從第19 章到第20 章，主要講述Angular 的兩個延伸套用，每個套用均包含完整的實戰例子。其中第19 章講解Angular 的混合套用開發，即ionic；而第20 章則講述Angular 的服務端渲染技術。
誰適合這本書
本書的主要目標讀者是有一定JavaScript 開發能力的新人，有Angular 1.x 相關經驗的開發者，有Java、C# 等後端語言編程經驗的人，或者想通過本書快速了解Angular 掌握更多新鮮理念的資深工程師等。
如何閱讀此書
本書基於Angular 5.0 版本進行講解。
本書按照由低到高的難度變化思路進行撰寫。第一部分適合剛接觸Angular 的讀者進行細緻的閱讀，如果已有相關基礎或比較熟悉Angular 的讀者可以跳過第一部分，直接學習第二部分深入理解或者第三部分項目實戰。
全書的插圖採用統一的繪圖風格，以手繪風格的形式表現出來，力求簡潔，如遇部分難懂之處可配合上下文進行解讀。
本書包含諸多代碼段，這些代碼段可分為兩類，一類是比較完整獨立的，跟著編寫並能看到運行效果的示例代碼；另一類是輔助學習的代碼段，以介紹概念知識點為主，力求減少不相關代碼的干擾，通常只截取最核心的片段，並以伴有省略號的形式出現。
為了加強對相關知識點的理解，本書也加入了一些旁註，對內容進行相關補充。部分較為深入但不常用的知識點，將以擴展閱讀或者批註的形式展現。
