Angular開發(fā)實(shí)戰(zhàn)

目   錄
第1章  初識(shí)Angular 1
1.1  ANGULAR簡介 1
1.1.1  AngularJS 1.x 的誕生 2
1.1.2  快速發(fā)展的 Angular 2
1.1.3  三分天下的前端框架 3
1.1.4  未來的選擇 4
1.2  搭建開發(fā)環(huán)境 4
1.2.1  安裝Node.js和NPM 4
1.2.2  安裝Git 6
1.2.3  安裝Angular CLI 7
1.2.4  開發(fā)工具的選擇 7
1.2.5  安裝Angular輔助編碼插件 9
1.3  實(shí)戰(zhàn)練習(xí)：個(gè)ANGULAR程序 10
1.3.1  Hello Angular 10
1.3.2  Angular目錄結(jié)構(gòu) 10
1.3.3  Angular CLI詳解 12
1.3.4  如何學(xué)習(xí)Angular 14
1.4  ANGULAR UI庫 14
1.4.1  NG-ZORRO 14
1.4.2  Angular Material 15
1.4.3  ng-bootstrap 16
1.4.4  Ionic 16
1.5  小結(jié) 17
第2章  初識(shí)TypeScript 18
2.1  TYPESCRIPT簡介 18
2.1.1  動(dòng)態(tài)類型語言與靜態(tài)類型語言 18
2.1.2  開發(fā)環(huán)境的搭建 19
2.2  數(shù)據(jù)類型 20
2.2.1  布爾類型 20
2.2.2  數(shù)字類型 20
2.2.3  字符串類型 21
2.2.4  數(shù)組類型與元組類型 21
2.2.5  枚舉類型 21
2.2.6  any類型 22
2.2.7  void類型 22
2.2.8  null與undefined類型 22
2.3  函數(shù) 23
2.3.1  函數(shù)的使用 23
2.3.2  構(gòu)造函數(shù) 23
2.3.3  可選參數(shù) 24
2.3.4  默認(rèn)參數(shù) 24
2.3.5  箭頭函數(shù) 25
2.4  類 26
2.4.1  屬性與方法 26
2.4.2  類的繼承 26
2.4.3  訪問權(quán)限修飾符 27
2.5  小結(jié) 28
第3章  指令 29
3.1  指令的分類 29
3.1.1  組件 29
3.1.2  結(jié)構(gòu)型指令 30
3.1.3  屬性型指令 30
3.2  內(nèi)置指令 30
3.2.1  ngFor 30
3.2.2  ngIf 30
3.2.3  ngSwitch 31
3.2.4  ngStyle 31
3.2.5  ngClass 32
3.2.6  ngNonBindable 32
3.3  實(shí)戰(zhàn)練習(xí)：自定義結(jié)構(gòu)型指令 32
3.3.1  星號(hào)前綴 33
3.3.2  創(chuàng)建一個(gè)結(jié)構(gòu)型指令 33
3.3.3  響應(yīng)用戶操作 34
3.4  小結(jié) 36
第4章  使用組件打造你的項(xiàng)目 37
4.1  組件 37
4.1.1  組件的組成 37
4.1.2  組件化思想 38
4.2  注解 38
4.3  生命周期 39
4.4  數(shù)據(jù)傳遞 39
4.4.1  數(shù)據(jù)的輸入 40
4.4.2  數(shù)據(jù)的輸出 42
4.5  實(shí)戰(zhàn)練習(xí)：城市組件 44
4.6  小結(jié) 47
第5章  依賴注入 48
5.1  控制反轉(zhuǎn)與依賴注入 48
5.1.1  控制反轉(zhuǎn) 48
5.1.2  依賴注入 49
5.2  ANGULAR中的依賴注入 50
5.2.1  Injector（注入器） 50
5.2.2  Provider（提供者） 51
5.2.3  Dependence（依賴） 52
5.2.4  依賴注入的流程 52
5.3  實(shí)戰(zhàn)練習(xí)：用戶信息頁 52
5.4  小結(jié) 56
第6章  HTTP 57
6.1  HTTPCLIENT——發(fā)送條網(wǎng)絡(luò)請(qǐng)求 57
6.2  HTTP協(xié)議基礎(chǔ)知識(shí) 59
6.2.1  請(qǐng)求方法 59
6.2.2  HTTP狀態(tài)碼 60
6.2.3  請(qǐng)求報(bào)文 61
6.3  HTTP與HTTPS 63
6.3.1  為什么需要HTTPS 63
6.3.2  什么是 HTTPS 63
6.3.3  HTTPS工作過程 63
6.3.4  申請(qǐng)HTTPS 64
6.3.5  為什么不一直使用HTTPS 65
6.4  實(shí)戰(zhàn)練習(xí)：制作一個(gè)HTTP攔截器 65
6.5  小結(jié) 68
第7章  表單 69
7.1  ANGULAR中的表單 69
7.1.1  響應(yīng)式表單與模板驅(qū)動(dòng)型表單 69
7.1.2  FormBuilder 70
7.2  實(shí)戰(zhàn)練習(xí)：模板驅(qū)動(dòng)型表單 70
7.2.1  創(chuàng)建模板驅(qū)動(dòng)型表單項(xiàng)目 70
7.2.2  在登錄組件實(shí)現(xiàn)模板驅(qū)動(dòng)型表單 71
7.3  實(shí)戰(zhàn)練習(xí)：響應(yīng)式表單 74
7.3.1  創(chuàng)建響應(yīng)式表單項(xiàng)目 74
7.3.2  使用響應(yīng)式表單構(gòu)建個(gè)人資料頁 75
7.4  小結(jié) 78
第8章  路由 79
8.1  路由的基本用法 79
8.1.1  路由的配置 79
8.1.2  讓路由與組件對(duì)應(yīng) 80
8.1.3  設(shè)置默認(rèn)路徑 82
8.2  路由的位置策略 83
8.2.1  HashLocationStrategy 83
8.2.2  如何使用位置策略 83
8.2.3  如何選擇兩種位置策略 84
8.3  路由的跳轉(zhuǎn)與傳參 85
8.3.1  路由的跳轉(zhuǎn) 85
8.3.2  路由的傳參 86
8.4  子路由 91
8.5  實(shí)戰(zhàn)練習(xí)：路由框架的搭建 93
8.6  小結(jié) 96
第9章  Angular中的測(cè)試 97
9.1  測(cè)試的意義 97
9.2  個(gè)測(cè)試?yán)?98
9.3  ANGULAR測(cè)試工具 100
9.3.1  Jasmine 100
9.3.2  Karma 102
9.3.3  實(shí)戰(zhàn)練習(xí)：單元測(cè)試常用API 103
9.4  端對(duì)端測(cè)試 108
9.4.1  Protractor 108
9.4.2  實(shí)戰(zhàn)練習(xí)：端對(duì)端測(cè)試常用API 108
9.5  小結(jié) 113
第10章  后臺(tái)模擬環(huán)境的搭建 114
10.1  前后端分離 114
10.2  POSTMAN的安裝與使用 115
10.2.1  Postman的安裝 115
10.2.2  Postman的使用 116
10.3  JSON-SERVER的安裝與使用 117
10.3.1  json-server的安裝與配置 118
10.3.2  個(gè)json-server程序 120
10.4  實(shí)戰(zhàn)練習(xí)：使用JSON-SERVER實(shí)現(xiàn)增刪改查 121
10.4.1  項(xiàng)目的創(chuàng)建與配置 121
10.4.2  數(shù)據(jù)的查詢與刪除 122
10.4.3  數(shù)據(jù)的新增與編輯 125
10.5  小結(jié) 130
第11章  項(xiàng)目實(shí)戰(zhàn)：待辦列表 131
11.1  待辦列表設(shè)計(jì) 131
11.2  待辦列表的創(chuàng)建 133
11.2.1  CLI版本與UI樣式庫 133
11.2.2  項(xiàng)目的創(chuàng)建 133
11.3  待辦列表開發(fā) 135
11.3.1  主面板組件的開發(fā) 135
11.3.2  待辦項(xiàng)組件的開發(fā) 138
11.3.3  彈出式窗口組件的開發(fā) 142
11.4  修改為網(wǎng)絡(luò)請(qǐng)求應(yīng)用 150
11.4.1  后臺(tái)環(huán)境的配置 150
11.4.2  使用json-server實(shí)現(xiàn)網(wǎng)絡(luò)請(qǐng)求版 151
11.5  小結(jié) 156
第12章  項(xiàng)目實(shí)戰(zhàn)：商城后臺(tái)管理系統(tǒng) 157
12.1  項(xiàng)目設(shè)計(jì) 157
12.2  項(xiàng)目起步 160
12.2.1  框架選型 160
12.2.2  項(xiàng)目的創(chuàng)建 161
12.3  路由構(gòu)建 163
12.3.1  組件的創(chuàng)建 163
12.3.2  路由的配置 163
12.4  資產(chǎn)盤點(diǎn)模塊的開發(fā) 170
12.4.1  資產(chǎn)概況的開發(fā) 170
12.4.2  交易數(shù)據(jù)分析的開發(fā) 174
12.5  商品管理模塊的開發(fā) 177
12.5.1  商品查詢的開發(fā) 177
12.5.2  商品新增/編輯的開發(fā) 180
12.6  個(gè)人中心模塊的開發(fā) 184
12.6.1  個(gè)人資料查看的開發(fā) 184
12.6.2  個(gè)人資料設(shè)置的開發(fā) 186
12.7  消息管理模塊的開發(fā) 189
12.8  小結(jié) 192