Angular JS權威教程

第1章　初識AngularJS　　1
1.1　瀏覽器如何獲取網頁　　1
1.2　瀏覽器是什麼　　2
1.3　AngularJS是什麼　　2
1.3.1　AngularJS有什麼不同　　3
1.3.2　許可　　3

第2章　數據綁定和第一個AngularJS Web應用　　4
2.1　AngularJS中的數據綁定　　5
2.2　簡單的數據綁定　　6
2.3　數據綁定的最佳實踐　　8

第3章　模塊　　10
3.1　參數　　11
3.1.1　name（字符串）　　11
3.1.2　requires（字符串數組）　　11

第4章　作用域　　12
4.1　視圖和＄scope的世界　　12
4.2　就是HTML而已　　13
4.3　作用域能做什麼　　14
4.4　＄scope的生命周期　　14
4.4.1　創建　　15
4.4.2　鏈接　　15
4.4.3　更新　　15
4.4.4　銷毀　　15
4.5　指令和作用域　　15

第5章　控制器　　16
5.1　控制器嵌套（作用域包含作用域）　　18

第6章　表達式　　20
6.1　解析AngularJS表達式　　20
6.2　插值字符串　　21

第7章　過濾器　　24
7.1　自定義過濾器　　29
7.2　表單驗證　　29

第8章　指令簡介　　43
8.1　指令：自定義HTML元素和屬性　　44
8.2　向指令中傳遞數據　　50

第9章　內置指令　　56
9.1　基礎ng屬性指令　　56
9.1.1　布爾屬性　　56
9.1.2　類布爾屬性　　58
9.2　在指令中使用子作用域　　59

第10章　指令詳解　　72
10.1　指令定義　　72
10.1.1　restrict（字符串）　　74
10.1.2　優先級（數值型）　　75
10.1.3　terminal（布爾型）　　75
10.1.4　template（字符串或函數）　　76
10.1.5　templateUrl（字符串或函數）　　76
10.1.6　replace（布爾型）　　77
10.2　指令作用域　　77
10.2.1　scope參數（布爾型或對象）　　78
10.2.2　隔離作用域　　80
10.3　綁定策略　　81
10.3.1　transclude　　82
10.3.2　controller（字符串或函數）　　84
10.3.3　controllerAs（字符串）　　86
10.3.4　require（字符串或數組）　　86
10.4　AngularJS的生命周期　　87
10.4.1　編譯階段　　87
10.4.2　compile（對象或函數）　　88
10.4.3　鏈接　　89
10.5　ngModel　　90
10.5.1　自定義渲染　　92
10.5.2　屬性　　92
10.6　自定義驗證　　93

第11章　AngularJS模塊加載　　95
11.1　配置　　95
11.2　運行塊　　96

第12章　多重視圖和路由　　98
12.1　安裝　　98
12.2　布局模板　　99
12.3　路由　　99
12.4　＄location服務　　103
12.5　路由模式　　105
12.5.1　HTML5模式　　105
12.5.2　路由事件　　106
12.5.3　關於搜索引擎索引　　107
12.6　更多關於路由的內容　　107
12.6.1　頁面重新加載　　107
12.6.2　異步的地址變化　　107

第13章　依賴注入　　108
13.1　推斷式注入聲明　　109
13.2　顯式注入聲明　　110
13.3　行內注入聲明　　110
13.4　＄injector API　　111
13.4.1　annotate()　　111
13.4.2　get()　　111
13.4.3　has()　　111
13.4.4　instantiate()　　112
13.4.5　invoke()　　112
13.5　ngMin　　112
13.5.1　安裝　　113
13.5.2　使用ngMin　　113
13.5.3　工作原理　　113

第14章　服務　　114
14.1　注冊一個服務　　114
14.2　使用服務　　116
14.3　創建服務時的設置項　　118
14.3.1　factory()　　119
14.3.2　service()　　119
14.3.3　provider()　　120
14.3.4　constant()　　122
14.3.5　value()　　122
14.3.6　何時使用value()和constant()　　123
14.3.7　decorator()　　123

第15章　同外界通信：XHR和服務器通信　　125
15.1　使用＄http　　125
15.2　設置對象　　128
15.3　響應對象　　130
15.4　緩存HTTP請求　　131
15.5　攔截器　　132
15.6　設置＄httpProvider　　133
15.7　使用＄resource　　134
15.8　安裝　　134
15.9　應用＄resource　　135
15.9.1　基於HTTP GET方法　　135
15.9.2　基於非HTTP GET類型的方法　　136
15.9.3　＄resource實例　　137
15.9.4　＄resource實例是異步的　　138
15.9.5　附加屬性　　138
15.10　自定義＄resource方法　　138
15.11　＄resource設置對象　　139
15.12　＄resource服務　　141
15.13　使用Restangular　　142
15.14　Restangular簡介　　142
15.15　安裝Restangular　　143
15.16　Restangular對象簡介　　144
15.17　使用Restangular　　145
15.17.1　我的HTTP方法們怎麼辦　　146
15.17.2　自定義查詢參數和頭　　147
15.18　設置Restangular　　147

第16章　XHR實踐　　153
16.1　跨域和同源策略　　153
16.2　JSONP　　153
16.3　使用CORS　　154
16.3.1　設置　　154
16.3.2　服務器端CORS支持　　155
16.3.3　簡單請求　　155
16.3.4　非簡單請求　　156
16.4　服務器端代理　　157
16.5　使用JSON　　157
16.6　使用XML　　158
16.7　使用AngularJS進行身份驗證　　159
16.7.1　服務器端需求　　159
16.7.2　客戶端身份驗證　　160
16.8　和MongoDB通信　　165

第17章　promise　　168
17.1　什麼是promise　　168
17.2　為什麼使用promise　　169
17.3　Angular中的promise　　170
17.4　鏈式請求　　173
17.4.1　all(promises)　　174
17.4.2　defer()　　174
17.4.3　reject(reason)　　174
17.4.4　when(value)　　174

第18章　服務器通信　　175
18.1　自定義服務器端　　175
18.2　安裝NodeJS　　175
18.3　安裝Express　　176
18.4　調用API　　178
18.5　使用Amazon AWS的無服務器應用　　181
18.5.1　DynamoDB　　181
18.5.2　簡單通知服務（SNS）　　181
18.5.3　簡單隊列服務（SQS，Simple Queue Service）　　182
18.5.4　簡單存儲服務（S3）　　182
18.5.5　安全令牌服務（STS）　　182
18.6　AWSJS + Angular　　182
18.7　開始　　182
18.8　介紹　　184
18.9　安裝　　184
18.10　運行　　185
18.11　用戶認證/鑒權　　186
18.12　UserService　　190
18.13　遷移到AWS上　　191
18.14　AWSService　　194
18.15　在Dynamo上開始　　196
18.16　＄cacheFactory　　196
18.17　保存currentUser　　197
18.18　上傳到S3　　199
18.19　處理文件上傳　　201
18.20　查詢Dynamo　　203
18.21　在HTML顯示列表　　204
18.22　出售我們的作品　　205
18.23　使用Stripe　　206
18.24　使用Firebase的無服務器應用　　209
18.25　使用Firebase和Angular的三方數據綁定　　210
18.26　從AngularFire開始　　211
18.26.1　注冊並創建一個Firebase　　211
18.26.2　包含Firebase和AngularFire庫　　212
18.26.3　把Firebase作為依賴項添加　　212
18.26.4　綁定模型到Firebase URL　　212
18.26.5　數據同步　　213
18.27　在AngularFire中排序　　214
18.28　Firebase事件　　215
18.29　顯式同步　　215
18.30　用AngularFire進行認證　　216
18.31　認證事件　　217
18.31.1　＄logout()　　218
18.31.2　＄createUser()　　218
18.32　使用Firebase托管部署你的Angular應用　　218
18.32.1　安裝Firebase工具　　218
18.32.2　部署你的Web站點　　219
18.33　除了AngularFire之外　　219

第19章　測試　　220
19.1　為什麼要做測試　　220
19.2　測試策略　　220
19.3　開始測試　　220
19.4　AngularJS測試的類型　　221
19.4.1　單元測試　　221
19.4.2　端到端測試　　222
19.5　開始　　222
19.6　初始化Karma配置文件　　223
19.7　配置選項　　226
19.8　使用RequireJS　　231
19.9　Jasmine　　233
19.9.1　細則套件　　233
19.9.2　定義一個細則　　233
19.10　預期　　234
19.10.1　內置的匹配器　　234
19.10.2　安裝和卸載　　237
19.11　端到端的介紹　　238
19.11.1　選項輸入　　244
19.11.2　重復循環元素　　244
19.12　模擬和測試幫助函數　　245
19.13　模擬＄httpBackend　　246
19.14　測試一個應用　　251
19.14.1　測試路由　　252
19.14.2　測試頁面內容　　255
19.14.3　測試控制器　　257
19.14.4　測試服務和工廠　　259
19.14.5　測試過濾器　　263
19.14.6　測試模板　　264
19.14.7　測試指令　　266
19.15　測試事件　　269
19.16　對Angular的持續集成　　270
19.17　Protractor　　270
19.18　配置　　272
19.19　配置選項　　273
19.20　編寫測試　　275
19.21　測試實踐　　278
19.21.1　我們的應用　　278
19.21.2　測試的策略　　279
19.22　建立我們的第一個測試　　279
19.23　測試輸入框　　281
19.23.1　測試列表　　282
19.23.2　測試路由　　284
19.24　頁面對象　　285

第20章　事件　　287
20.1　什麼是事件　　287
20.2　事件傳播　　287
20.2.1　使用＄emit來冒泡事件　　288
20.2.2　使用＄broadcast向下傳遞事件　　288
20.3　事件監聽　　289
20.4　事件對象　　289
20.5　事件相關的核心服務　　290
20.5.1　核心系統的＄emitted事件　　290
20.5.2　核心系統的＄broadcast事件　　290

第21章　架構　　292
21.1　目錄結構　　292
21.2　模塊　　293
21.3　控制器　　294
21.4　指令　　296
21.5　測試　　296

第22章　Angular動畫　　297
22.1　安裝　　297
22.2　它是如何運作的　　297
22.3　使用CSS3過渡　　298
22.4　使用CSS3動畫　　300
22.5　交錯CSS過渡/動畫　　301
22.5.1　交錯CSS過渡　　301
22.5.2　交錯CSS動畫　　302
22.5.3　什麼指令支持交錯動畫　　302
22.6　使用JavaScript動畫　　302
22.7　微調動畫　　303
22.8　DOM回調事件　　304
22.9　內置指令的動畫　　304
22.9.1　ngRepeat動畫　　304
22.9.2　ngView動畫　　306
22.9.3　ngInclude動畫　　308
22.9.4　ngSwitch動畫　　310
22.9.5　ngIf動畫　　312
22.9.6　ngClass動畫　　314
22.9.7　ngShow/ngHide動畫　　316
22.10　創建自定義動畫　　318
22.10.1　addClass()　　319
22.10.2　removeClass()　　320
22.10.3　enter()　　321
22.10.4　leave()　　322
22.10.5　move()　　323
22.11　與第三方庫集成　　324
22.11.1　Animate.css　　324
22.11.2　TweenMax/TweenLite　　324

第23章　digest循環和＄apply　　326
23.1　＄watch列表　　326
23.2　臟值檢查　　327
23.3　＄watch　　328
23.4　＄watchCollection　　330
23.5　頁面中的＄digest循環　　330
23.6　＄evalAsync列表　　331
23.7　＄apply　　332
23.8　何時使用＄apply　　332

第24章　揭秘Angular　　334
24.1　視圖的工作原理　　335
24.1.1　編譯階段　　335
24.1.2　運行時　　336

第25章　AngularJS精華擴展　　337
25.1　AngularUI　　337
25.2　安裝　　337
25.3　ui-router　　337
25.3.1　安裝　　337
25.3.2　事件　　342
25.3.3　＄stateParams　　343
25.3.4　＄urlRouterProvider　　344
25.3.5　創建一個導航程序　　345
25.4　ui-utils　　346
25.4.1　安裝　　347
25.4.2　mask　　347
25.4.3　ui-event　　347
25.4.4　ui-format　　348

第26章　移動應用　　350
26.1　響應式Web應用　　350
26.2　交互　　350
26.2.1　安裝　　350
26.2.2　ngTouch　　351
26.2.3　＄swipe服務　　352
26.2.4　angular-gestures和多點觸控手勢　　353
26.2.5　安裝angular-gestures　　354
26.2.6　使用angular-gestures　　354
26.3　Cordova中的原生應用程序　　355
26.4　Cordova入門　　356
26.4.1　Cordova開發流程　　359
26.4.2　平台　　359
26.4.3　插件　　359
26.4.4　構建　　360
26.4.5　模擬和運行　　360
26.4.6　開發階段　　360
26.4.7　Anguar中的Cordova服務　　361
26.5　引入Angular　　362
26.6　使用Yeoman構建　　363
26.6.1　修改Yeoman以便使用Cordova　　364
26.6.2　裝配Yeoman構建　　365
26.6.3　構建移動部分　　365
26.6.4　處理引導程序　　367

第27章　本地化　　369
27.1　angular-translate　　369
27.2　安裝　　369
27.3　教你的應用一種新語言　　370
27.4　多語言支持　　371
27.5　運行時切換語言　　372
27.6　加載語言　　373
27.7　angular-gettext　　374
27.8　安裝　　374
27.9　用法　　375
27.10　字符串提取　　375
27.11　翻譯字符串　　377
27.12　編譯新語言　　378
27.13　改變語言　　379

第28章　緩存　　381
28.1　什麼是緩存　　381
28.2　Angular中的緩存　　381
28.2.1　＄cacheFactory簡介　　381
28.2.2　緩存對象　　382
28.3　＄http中的緩存　　382
28.3.1　默認的＄http緩存　　382
28.3.2　自定義緩存　　383
28.4　為＄http設置默認緩存　　384

第29章　安全性　　385
29.1　嚴格的上下文轉義：＄sce服務　　385
29.2　URL白名單　　387
29.3　URL黑名單　　388
29.4　＄sce API　　388
29.4.1　getTrusted　　388
29.4.2　parse　　389
29.4.3　trustAs　　389
29.4.4　isEnabled　　390
29.5　配置＄sce　　390
29.6　可信賴的上下文類型　　390

第30章　AngularJS和IE瀏覽器　　391
30.1　Ajax緩存　　393
30.2　AngularJS中的SEO　　393
30.3　使Angular應用可被索引　　393
30.4　服務端　　393
30.4.1　hashbang語法　　394
30.4.2　HTML5路由模式　　394
30.5　服務端處理SEO的選項　　394
30.5.1　使用Node/Express中間件　　395
30.5.2　使用Apache重寫URL　　395
30.5.3　使用Ngnix代理URL　　396
30.6　獲取快照　　396
30.7　使用Zombie.js獲取HTML快照　　397
30.8　使用grunt-html-snapshot　　398
30.9　Prerender.io　　399
30.10　＜noscript＞方法　　400

第31章　構建Angular Chrome應用　　401
31.1　了解Chrome應用　　401
31.1.1　manifest.json　　401
31.1.2　背景腳本　　401
31.1.3　視圖　　401
31.2　構建你的Chrome應用　　402
31.3　搭建框架　　402
31.4　manifest.json　　403
31.5　tab.html　　404
31.6　在Chrome中加載應用　　405
31.7　主模塊　　406
31.8　構建主頁　　406
31.9　使用Wundergroud的天氣API　　408
31.10　設置界面　　411
31.11　實現用戶服務　　413
31.12　城市自動填充/自動完成　　415
31.13　添加時區支持　　418

第32章　優化Angular應用　　421
32.1　優化什麼　　421
32.2　優化＄digest循環　　421
32.3　優化ng-repeat　　423
32.4　優化＄digest調用　　423
32.5　優化＄watch函數　　424
32.5.1　bindonce　　425
32.5.2　＄watch函數的自動優化　　427
32.6　優化過濾器　　427
32.6.1　不變的數據　　427
32.6.2　過濾后的數據　　427
32.7　頁面加載優化技巧　　428
32.7.1　壓縮　　429
32.7.2　利用＄templateCache　　429

第33章　調試AngularJS　　430
33.1　從DOM中調試　　430
33.1.1　scope()　　431
33.1.2　controller()　　431
33.1.3　injector()　　431
33.1.4　inheritedData()　　431
33.2　調試器　　431
33.3　Angular Batarang　　432
33.3.1　安裝Batarang　　432
33.3.2　檢查模型　　433
33.3.3　檢查性能　　433
33.3.4　檢查依賴圖表　　434
33.3.5　可視化應用　　434

第34章　下一步　　435
34.1　jqLite和jQuery　　435
34.2　了解基本工具　　436
34.3　Grunt　　436
34.4　grunt-angular-templates　　439
34.4.1　安裝　　439
34.4.2　用法　　440
34.4.3　可用選項　　440
34.4.4　用法　　442
34.5　Lineman　　443
34.6　Bower　　445
34.6.1　安裝　　445
34.6.2　Bower簡介　　445
34.6.3　配置Bower　　446
34.6.4　搜索程序包　　447
34.6.5　安裝程序包　　447
34.6.6　使用程序包　　447
34.6.7　移除程序包　　448
34.7　Yeoman　　448
34.7.1　安裝　　448
34.7.2　用法　　449
34.7.3　創建路由　　451
34.7.4　創建控制器　　451
34.7.5　創建自定義指令　　451
34.7.6　創建自定義過濾器　　451
34.7.7　創建視圖　　451
34.7.8　創建服務　　452
34.7.9　創建裝飾器　　452
34.8　配置Angular生成器　　452
34.8.1　CoffeeScript　　452
34.8.2　安全壓縮　　452
34.8.3　跳過索引　　452
34.9　測試應用　　452
34.10　打包應用　　453
34.11　打包模板　　453

第35章　總結　　456