一.資料圖片

二.資料簡(jiǎn)介

本書堪稱Angular領(lǐng)域的里程碑式著作，涵蓋了關(guān)于Angular的幾乎所有內(nèi)容。對(duì)于沒有經(jīng)驗(yàn)的人，本書平實(shí)、通俗的講解，遞進(jìn)、嚴(yán)密的組織，可以讓人毫無壓力地登堂入室，迅速領(lǐng)悟新一代Web應(yīng)用開發(fā)的精髓。如果你有相關(guān)經(jīng)驗(yàn)，那本書對(duì)Angular概念和技術(shù)細(xì)節(jié)的全面剖析，以及引人入勝、切中肯綮的講解，將幫助你徹底掌握這個(gè)框架，在自己職業(yè)技術(shù)修煉之路上更進(jìn)一步。

三.資料目錄

第1章　編寫你的第一個(gè)Angular Web應(yīng)用　　1
1.1　仿制Reddit網(wǎng)站　　1
1.2　起步　　3
1.2.1　TypeScript　　3
1.2.2　angular-cli　　3
1.2.3　示例項(xiàng)目　　4
1.3　運(yùn)行應(yīng)用　　7
1.3.1　制作Component　　8
1.3.2　導(dǎo)入依賴　　9
1.3.3　Component注解　　10
1.3.4　用templateUrl添加模板　　11
1.3.5　添加template　　11
1.3.6　用styleUrls添加CSS樣式　　12
1.3.7　加載組件　　12
1.4　把數(shù)據(jù)添加到組件中　　13
1.5　使用數(shù)組　　15
1.6　使用UserItemComponent組件　　18
1.6.1　渲染UserItemComponent　　18
1.6.2　接收輸入　　19
1.6.3　傳入Input值　　20
1.7 “啟動(dòng)”速成班　　21
1.8　擴(kuò)展你的應(yīng)用　　22
1.8.1　添加CSS　　24
1.8.2　應(yīng)用程序組件　　24
1.8.3　添加互動(dòng)　　26
1.8.4　添加文章組件　　29
1.9　渲染多行　　36
1.9.1　創(chuàng)建Article類　　36
1.9.2　存儲(chǔ)多篇文章　　40
1.9.3　使用inputs配置ArticleComponent　　41
1.9.4　渲染文章列表　　42
1.10　添加新文章　　44
1.11　最后的修整　　44
1.11.1　顯示文章所屬的域名　　44
1.11.2　基于分?jǐn)?shù)重新排序　　45
1.12　全部代碼　　45
1.13　總結(jié)　　45
1.14　獲得幫助　　46
第2章　TypeScript　　47
2.1　Angular是用TypeScript構(gòu)建的　　47
2.2　TypeScript提供了哪些特性　　48
2.3　類型　　49
2.4　內(nèi)置類型　　50
2.4.1　字符串　　50
2.4.2　數(shù)字　　50
2.4.3　布爾類型　　51
2.4.4　數(shù)組　　51
2.4.5　枚舉　　51
2.4.6　任意類型　　52
2.4.7 “無”類型　　52
2.5　類　　52
2.5.1　屬性　　52
2.5.2　方法　　53
2.5.3　構(gòu)造函數(shù)　　54
2.5.4　繼承　　55
2.6　工具　　57
2.6.1　胖箭頭函數(shù)　　57
2.6.2　模板字符串　　58
2.7　總結(jié)　　59
第3章　Angular的工作原理　　60
3.1　應(yīng)用　　60
3.1.1　主導(dǎo)航組件　　61
3.1.2　面包屑導(dǎo)航組件　　61
3.1.3　產(chǎn)品列表組件　　62
3.2　產(chǎn)品數(shù)據(jù)模型　　64
3.3　組件　　64
3.4　組件注解　　66
3.4.1　組件selector　　66
3.4.2　組件template　　67
3.4.3　添加產(chǎn)品　　67
3.4.4　用模板綁定來查看產(chǎn)品　　68
3.4.5　添加更多產(chǎn)品　　69
3.4.6　選擇一個(gè)產(chǎn)品　　70
3.4.7　用<products-list>列出產(chǎn)品　　70
3.5　產(chǎn)品列表組件　　73
3.5.1　設(shè)置ProductsList的@Component配置項(xiàng)　　73
3.5.2　組件的輸入　　74
3.5.3　組件的輸出　　77
3.5.4　觸發(fā)自定義事件　　78
3.5.5　編寫ProductsList的控制器類　　79
3.5.6　編寫ProdctsList的視圖模板　　80
3.5.7　完整的ProductsList組件　　81
3.6　產(chǎn)品條目組件　　83
3.6.1　產(chǎn)品條目的組件配置　　83
3.6.2　產(chǎn)品條目組件的定義類　　84
3.6.3　產(chǎn)品條目組件的template　　84
3.6.4　完整的ProductRow代碼清單　　85
3.7　產(chǎn)品圖片組件　　85
3.8　價(jià)格展示組件　　86
3.9　產(chǎn)品分類組件　　87
3.10　創(chuàng)建NgModule并啟動(dòng)應(yīng)用　　88
3.11　完整的項(xiàng)目　　89
3.12　關(guān)于數(shù)據(jù)架構(gòu)的一點(diǎn)說明　　90
第4章　內(nèi)置指令　　91
4.1　簡(jiǎn)介　　91
4.2　ngIf　　91
4.3　ngSwitch　　92
4.4　ngStyle　　93
4.5　ngClass　　95
4.6　ngFor　　98
4.7　ngNonBindable　　102
4.8　總結(jié)　　102
第5章　Angular中的表單　　103
5.1　表單——既重要，又復(fù)雜　　103
5.2　FormControl和FormGroup　　103
5.2.1　FormControl　　104
5.2.2　FormGroup　　104
5.3　我們的第一個(gè)表單　　105
5.3.1　加載FormsModule　　106
5.3.2　簡(jiǎn)易SKU表單：@Component注解　　107
5.3.3　簡(jiǎn)易SKU表單：template　　107
5.3.4　簡(jiǎn)易SKU表單：組件定義類　　110
5.3.5　試試看　　110
5.4　使用FormBuilder　　111
5.5　響應(yīng)式表單 FormBuilder　　112
5.5.1　使用FormBuilder　　112
5.5.2　在視圖中使用myForm　　113
5.5.3　試試看　　114
5.6　添加驗(yàn)證　　115
5.6.1　顯式地把sku設(shè)置為實(shí)例變量　　116
5.6.2　自定義驗(yàn)證器　　120
5.7　監(jiān)聽變化　　121
5.8　ngModel　　122
5.9　總結(jié)　　124
第6章　HTTP　　125
6.1　簡(jiǎn)介　　125
6.2　使用 @angular/http　　126
6.3　基本請(qǐng)求　　127
6.3.1　構(gòu)建SimpleHTTPComponent的@Component　　127
6.3.2　構(gòu)建SimpleHTTPComponent的template　　128
6.3.3　構(gòu)建SimpleHTTPComponent控制器　　128
6.3.4　完整的SimpleHTTP-Component　　130
6.4　編寫YouTubeSearchComponent　　130
6.4.1　編寫SearchResult　　132
6.4.2　編寫YouTubeService　　132
6.4.3　編寫SearchBox　　140
6.4.4　編寫SearchResult-Component　　145
6.4.5　編寫YouTubeSearch-Component　　147
6.5　@angular/http API　　150
6.5.1　發(fā)起一個(gè)POST請(qǐng)求　　150
6.5.2　PUT/PATCH/DELETE/HEAD　　150
6.5.3　RequestOptions　　151
6.6　總結(jié)　　151
第7章　路由　　152
7.1　為什么需要路由　　152
7.2　客戶端路由的工作原理　　153
7.2.1　初級(jí)階段：使用錨標(biāo)記　　153
7.2.2　進(jìn)化：HTML5客戶端路由　　154
7.3　編寫第一個(gè)路由配置　　155
7.4　Angular路由的組成部件　　155
7.4.1　導(dǎo)入　　155
7.4.2　路由配置　　155
7.4.3　安裝路由配置　　156
7.4.4　使用<router-outlet>調(diào)用RouterOutlet指令　　157
7.4.5　使用[routerLink]調(diào)用routerLink指令　　158
7.5　整合　　159
7.5.1　創(chuàng)建組件　　160
7.5.2　應(yīng)用程序組件　　161
7.5.3　配置路由　　163
7.6　路由策略　　164
7.7　路徑定位策略　　165
7.8　運(yùn)行應(yīng)用程序　　165
7.9　路由參數(shù)　　167
7.10　音樂搜索應(yīng)用　　168
7.10.1　首要步驟　　169
7.10.2　SpotifyService　　170
7.10.3　SearchComponent　　171
7.10.4　嘗試搜索　　179
7.10.5　TrackComponent　　180
7.10.6　音樂搜索應(yīng)用小結(jié)　　182
7.11　路由器鉤子　　182
7.11.1　AuthService　　183
7.11.2　LoginComponent　　184
7.11.3　ProtectedComponent組件和路由守衛(wèi)　　186
7.12　嵌套路由　　190
7.12.1　配置路由　　191
7.12.2　ProductsComponent組件　　191
7.13　總結(jié)　　194
第8章　依賴注入　　195
8.1　注入示例：PriceService　　196
8.2 “別打給我們……”　　197
8.3　依賴注入的部件　　199
8.4　嘗試注入器　　200
8.5　用NgModule提供依賴　　201
8.6　提供者　　202
8.6.1　使用類　　202
8.6.2　使用工廠　　203
8.6.3　使用值　　205
8.6.4　使用別名　　205
8.7　應(yīng)用中的依賴注入　　205
8.8　使用注入器　　207
8.9　替換值　　211
8.10　NgModule　　215
8.10.1　NgModule與JavaScript模塊　　215
8.10.2　編譯器與組件　　215
8.10.3　依賴注入與提供者　　216
8.10.4　組件可見性　　217
8.10.5　指定提供者　　218
8.11　總結(jié)　　219
第9章　Angular數(shù)據(jù)架構(gòu)　　220
第10章　使用可觀察對(duì)象的數(shù)據(jù)架構(gòu)，
第1部分：服務(wù)　　222
10.1　可觀察對(duì)象和RxJS　　222
10.1.1　注意：一些必備的RxJS相關(guān)知識(shí)　　222
10.1.2　學(xué)習(xí)響應(yīng)式編程和RxJS　　223
10.2　聊天應(yīng)用概覽　　224
10.2.1　組件　　225
10.2.2　數(shù)據(jù)模型　　226
10.2.3　服務(wù)　　226
10.2.4　總結(jié)　　226
10.3　實(shí)現(xiàn)數(shù)據(jù)模型　　227
10.3.1　User　　227
10.3.2　Thread　　227
10.3.3　Message　　228
10.4　實(shí)現(xiàn)UserService　　228
10.4.1　currentUser流　　229
10.4.2　設(shè)置新用戶　　230
10.4.3　UserService.ts　　231
10.5　MessagesService　　231
10.5.1　newMessages流　　231
10.5.2　messages流　　233
10.5.3　操作流模式　　233
10.5.4　共享流　　234
10.5.5　把Message對(duì)象添加到messages流中　　235
10.5.6　完整的MessagesService　　238
10.5.7　試用MessagesService　　241
10.6　ThreadsService　　242
10.6.1　當(dāng)前一組Thread的映射（threads流）　　242
10.6.2　按時(shí)間逆序排列的Thread列表（orderedthreads流）　　246
10.6.3　當(dāng)前已選的Thread（currentThread流）　　246
10.6.4　當(dāng)前已選Thread的Message列表（currentThread- Messages流）　　248
10.6.5　完整的ThreadsService　　250
10.7　總結(jié)　　251
第11章　使用可觀察對(duì)象的數(shù)據(jù)架構(gòu)，
第2部分：視圖組件　　252
11.1　構(gòu)建視圖：頂層組件ChatApp　　252
11.2　ChatThreads組件　　254
11.2.1　ChatThreads控制器　　255
11.2.2　ChatThreads的template　　255
11.3　單個(gè)ChatThread組件　　256
11.3.1　ChatThread控制器和ngOnInit　　257
11.3.2　ChatThread的template　　258
11.3.3　ChatThread的完整代碼　　258
11.4　ChatWindow組件　　259
11.4.1　ChatWindow組件類屬性　　260
11.4.2　ChatWindow的ngOnInit　　261
11.4.3　ChatWindow的send-Message　　261
11.4.4　ChatWindow的onEnter　　262
11.4.5　ChatWindow的scrollTo-Bottom　　262
11.4.6　ChatWindow的template　　263
11.4.7　處理鍵盤動(dòng)作　　264
11.4.8　使用ngModel　　264
11.4.9　點(diǎn)擊Send按鈕　　265
11.4.10　完整的ChatWindow組件　　265
11.5　ChatMessage組件　　267
11.5.1　設(shè)置incoming屬性　　268
11.5.2　ChatMessage的template　　268
11.5.3　完整的ChatMessage代碼清單　　270
11.6　ChatNavBar組件　　273
11.6.1　ChatNavBar的@Component　　273
11.6.2　ChatNavBar控制器　　273
11.6.3　ChatNavBar的template　　274
11.6.4　完整的ChatNavBar組件　　275
11.7　總結(jié)　　276
11.8　更進(jìn)一步　　277
第12章　基于TypeScript的Redux 簡(jiǎn)介　　278
12.1　Redux　　279
12.2　Redux核心概念　　280
12.2.1　reducer是什么　　280
12.2.2　定義Action和Reducer的接口　　281
12.2.3　創(chuàng)建第一個(gè)Reducer　　281
12.2.4　運(yùn)行第一個(gè)Reducer　　282
12.2.5　使用action調(diào)整計(jì)數(shù)器　　283
12.2.6　reducer的switch　　284
12.2.7　action的“參數(shù)”　　285
12.3　保存state　　286
12.3.1　使用store　　287
12.3.2　使用subscribe進(jìn)行通知　　287
12.3.3　Redux核心　　290
12.4　消息應(yīng)用　　291
12.4.1　消息應(yīng)用的state　　291
12.4.2　消息應(yīng)用的action　　292
12.4.3　消息應(yīng)用的reducer　　292
12.4.4　試用action　　295
12.4.5　action creator　　296
12.4.6　使用真正的Redux　　297
12.5　在Angular中使用Redux　　299
12.6　規(guī)劃應(yīng)用　　299
12.7　組建Redux　　300
12.7.1　定義應(yīng)用的state　　300
12.7.2　定義reducer　　301
12.7.3　定義action creator　　301
12.7.4　創(chuàng)建store　　302
12.8　CounterApp組件　　303
12.9　提供store　　304
12.10　啟動(dòng)應(yīng)用　　305
12.11　CounterComponent　　306
12.11.1　import　　306
12.11.2　模板　　306
12.11.3　constructor　　307
12.11.4　整合　　308
12.12　更進(jìn)一步　　310
12.13　參考資源　　310
第13章　在Angular中引入Redux　　312
13.1　閱讀背景　　312
13.2　聊天應(yīng)用概覽　　313
13.2.1　組件　　313
13.2.2　數(shù)據(jù)模型　　314
13.2.3　reducer　　315
13.2.4　總結(jié)　　315
13.3　實(shí)現(xiàn)數(shù)據(jù)模型　　315
13.3.1　User　　315
13.3.2　Thread　　316
13.3.3　Message　　316
13.4　應(yīng)用的state　　316
13.4.1　關(guān)于代碼布局　　317
13.4.2　根reducer　　317
13.4.3　UserState　　318
13.4.4　ThreadsState　　318
13.4.5　可視化AppState　　319
13.5　構(gòu)建reducer（和action creator）　　321
13.5.1　設(shè)置當(dāng)前用戶的action creator　　321
13.5.2　UsersReducer：設(shè)置當(dāng)前用戶　　321
13.5.3　會(huì)話和消息概覽　　322
13.5.4　添加新會(huì)話的action creator　　322
13.5.5　添加新會(huì)話的reducer　　323
13.5.6　添加新消息的action creator　　324
13.5.7　添加新消息的reducer　　325
13.5.8　選擇會(huì)話的action creator　　326
13.5.9　選擇會(huì)話的reducer　　327
13.5.10　reducer總結(jié)　　328
13.6　構(gòu)建Angular聊天應(yīng)用　　328
13.6.1　頂層組件ChatApp　　330
13.6.2　ChatPage　　330
13.6.3　容器型組件與展示型組件　　331
13.7　構(gòu)建ChatNavBar　　332
13.7.1　Redux選擇器　　334
13.7.2　會(huì)話選擇器　　334
13.7.3　未讀消息總數(shù)選擇器　　336
13.8　構(gòu)建ChatThreads組件　　336
13.8.1　ChatThreads控制器　　337
13.8.2　ChatThreads的template　　338
13.9　單個(gè)ChatThread組件　　338
13.10　構(gòu)建ChatWindow組件　　340
13.10.1　ChatWindow的update-State()　　341
13.10.2　ChatWindow的scrollToBottom()　　342
13.10.3　ChatWindow的sendMessage　　342
13.10.4　ChatWindow的onEnter　　343
13.10.5　ChatWindow的template　　343
13.10.6　處理鍵盤動(dòng)作　　345
13.10.7　使用ngModel　　345
13.10.8　點(diǎn)擊Send按鈕　　345
13.11　ChatMessage組件　　345
13.11.1　設(shè)置incoming屬性　　346
13.11.2　ChatMessage的template　　346
13.12　總結(jié)　　347
第14章　高級(jí)組件　　349
14.1　樣式　　349
14.1.1　視圖（樣式）封裝　　351
14.1.2　Shadow DOM封裝　　354
14.1.3　不使用封裝　　355
14.2　創(chuàng)建popup指令：引用并修改宿主元素　　357
14.2.1　popup指令的結(jié)構(gòu)　　357
14.2.2　使用ElementRef　　359
14.2.3　綁定到host屬性　　360
14.2.4　添加按鈕并使用exportAs　　362
14.3　使用內(nèi)容投影創(chuàng)建消息面板　　363
14.3.1　改變host屬性的CSS類　　364
14.3.2　使用ng-content　　364
14.4　查詢相鄰的指令：編寫標(biāo)簽頁(yè)　　366
14.4.1　Tab組件　　367
14.4.2　Tabset組件　　367
14.4.3　使用Tabset　　369
14.5　生命周期鉤子　　370
14.5.1　OnInit和OnDestroy　　371
14.5.2　OnChanges　　374
14.5.3　DoCheck　　378
14.5.4　AfterContentInit、AfterViewInit、AfterContentChecked和AfterViewChecked　　386
14.6　高級(jí)模板　　391
14.6.1　重寫ngIf：ngBookIf　　392
14.6.2　重寫ngFor：ngBook-Repeat　　394
14.7　變更檢測(cè)　　398
14.7.1　自定義變更檢測(cè)　　401
14.7.2　Zones　　405
14.7.3　可觀察對(duì)象和OnPush　　406
14.8　總結(jié)　　409
第15章　測(cè)試　　410
15.1　測(cè)試驅(qū)動(dòng)？　　410
15.2　端對(duì)端測(cè)試與單元測(cè)試　　411
15.3　測(cè)試工具　　411
15.3.1　Jasmine　　411
15.3.2　Karma　　412
15.4　編寫單元測(cè)試　　412
15.5　Angular單元測(cè)試框架　　412
15.6　測(cè)試前準(zhǔn)備　　413
15.7　測(cè)試服務(wù)類和HTTP　　415
15.7.1　HTTP要點(diǎn)　　416
15.7.2　偽裝　　417
15.7.3　模擬　　417
15.7.4　Http MockBackend　　418
15.7.5　TestBed.configureTes- tingModule和提供者　　418
15.7.6　測(cè)試getTrack方法　　419
15.8　測(cè)試組件間的路由　　424
15.8.1　為測(cè)試創(chuàng)建路由器　　424
15.8.2　模擬依賴　　427
15.8.3　探子　　427
15.9　回到測(cè)試代碼　　429
15.9.1　fakeAsync和advance　　431
15.9.2　inject　　432
15.9.3　測(cè)試ArtistComponent組件初始化　　432
15.9.4　測(cè)試ArtistComponent方法　　433
15.9.5　測(cè)試ArtistComponent DOM模板值　　434
15.10　測(cè)試表單　　436
15.10.1　創(chuàng)建一個(gè)ConsoleSpy　　438
15.10.2　安裝ConsoleSpy　　439
15.10.3　配置測(cè)試模塊　　439
15.10.4　測(cè)試表單　　440
15.10.5　重構(gòu)表單測(cè)試　　441
15.11　測(cè)試HTTP請(qǐng)求　　444
15.11.1　測(cè)試POST方法　　445
15.11.2　測(cè)試DELETE方法　　446
15.11.3　測(cè)試HTTP頭　　447
15.11.4　測(cè)試YouTubeService　　448
15.12　總結(jié)　　452
第16章　把AngularJS應(yīng)用升級(jí)到Angular　　453
16.1　周邊概念　　453
16.2　我們要構(gòu)建什么　　454
16.3　把AngularJS映射到Angular　　455
16.4　關(guān)于互操作性的需求　　456
16.5　AngularJS應(yīng)用　　456
16.5.1　AngularJS應(yīng)用的HTML　　458
16.5.2　代碼概覽　　458
16.5.3　AngularJS：PinsService　　459
16.5.4　AngularJS：配置路由　　460
16.5.5　AngularJS：HomeContro-ller　　461
16.5.6　AngularJS：HomeContro-ller模板　　461
16.5.7　AngularJS：pin指令　　462
16.5.8　AngularJS：pin指令模板　　462
16.5.9　AngularJS：AddContro-ller　　463
16.5.10　AngularJS：AddContro-ller模板　　465
16.5.11　AngularJS：總結(jié)　　467
16.6　構(gòu)建混合式應(yīng)用　　468
16.6.1　混合式應(yīng)用的結(jié)構(gòu)　　468
16.6.2　引導(dǎo)混合式應(yīng)用　　471
16.6.3　我們要升級(jí)什么　　473
16.6.4　插一小段內(nèi)容：類型文件　　475
16.6.5　寫Angular的PinControls- Component　　479
16.6.6　使用Angular的PinCon- trolsComponent　　481
16.6.7　把Angular的PinControls- Component降級(jí)到 AngularJS　　482
16.6.8　用Angular添加圖釘　　483
16.6.9　把AngularJS的PinsSer-vice和$state升級(jí)到Angular　　484
16.6.10　寫Angular版的AddPin- Component　　485
16.6.11　使用AddPinComponent　　490
16.6.12　把Angular的服務(wù)暴露給AngularJS　　490
16.6.13　實(shí)現(xiàn)AnalyticsService　　491
16.6.14　把Angular的Analytics- Service降級(jí)到AngularJS　　491
16.6.15　在AngularJS中使用AnalyticsService　　492
16.7　總結(jié)　　493
16.8　參考資源　　493

本文鏈接：http://fangxuan.com.cn/webfront/570.html