隨著互聯(lián)網(wǎng)技術(shù)的不斷進步和發(fā)展,前端技術(shù)的開發(fā)不僅體現(xiàn)在頁面制作和數(shù)據(jù)展示上,還需要考慮數(shù)據(jù)的業(yè)務邏輯和數(shù)據(jù)的處理。對于這種大前端需求的變化,如果還是使用之前的面向過程編程,會使代碼雜亂無序,無法復用,編程效率極低。
而使用AngularJS框架可以很好地處理這種情況,因為它是基于MVC模式進行代碼編寫的,每層的結(jié)構(gòu)都非常清晰明確,各司其職,極大地減少了代碼的冗余和程序員的工作量,同時,還大大提升了代碼的執(zhí)行效率。因此,該框架一經(jīng)推出,就深受程序員的喜愛。
AngularJS框架采用流行的MVC模式進行構(gòu)建,首次使用雙向的數(shù)據(jù)綁定來適應動態(tài)內(nèi)容的變化并允許模型和視圖之間的自動同步; 此外,框架使用依賴注入的設計模式時,對象無須手工創(chuàng)建,而是由框架自動創(chuàng)建并注入進來; 后,框架采用高內(nèi)聚低耦合法則進行模塊化設計,使每個模塊都盡可能減少重復,以提升效率。
本書以案例實戰(zhàn)為導向,對基礎知識點進行全面而系統(tǒng)地講解,希望讀者可在短時間內(nèi)全面、系統(tǒng)地了解并掌握AngularJS框架開發(fā)應用的知識。本書共11章,有針對性地介紹技術(shù)內(nèi)容。
第1~9章全面系統(tǒng)地介紹AngularJS框架的基礎內(nèi)容,包括數(shù)據(jù)綁定、過濾器、作用域、依賴注入、服務、指令和路由的使用方法與技巧。
第10、11章除介紹開發(fā)時應注意的事項外,還介紹了兩個完整的綜合應用案例。
本書特色
本書以AngularJS 穩(wěn)定的框架版本為主線,采用層層推進的方式,從易到難,深入挖掘AngularJS 框架為Web頁面開發(fā)所提供的各項API。本書的主旨就是幫助廣大喜愛使用AngularJS 框架開發(fā)Web應用的程序員,能夠快速上手構(gòu)建一個AngularJS應用。
本書面向零基礎用戶,從實用的角度出發(fā),以示例為主線,講解每個知識點,在內(nèi)容上由淺入深,逐步培養(yǎng)讀者的閱讀興趣并加深難度; 此外,為加深讀者對每個示例效果的理解,對每一個示例的示意圖都進行了精心編排和扼要說明。
配套資源
為便于教學,本書配有微課視頻、代碼、教學大綱、教學課件。
(1) 獲取微課視頻方式: 讀者先掃描本書封底的文泉云盤二維碼、綁定微信賬號,再掃描書中相應的視頻二維碼,觀看教學視頻。
(2) 獲取程序代碼方式: 先掃描本書封底文泉云盤二維碼、綁定微信賬號,再掃描下方二維碼,即可獲取。
(3) 其他配套資源可以通過掃描本書封底的書圈二維碼下載。
讀者對象
本書面向Web、AngularJS應用開發(fā)者,高等院校師生及廣大相關領域的計算機愛好者。無論是從事前端開發(fā)還是后臺代碼編寫的人員,都可以使用本書。
致謝
希望這部耗時數(shù)月、積累作者數(shù)年心得與技術(shù)感悟的拙著,能給每位讀者帶來思路上的啟發(fā)與技術(shù)上的提升,同時也希望借本書出版的機會能與國內(nèi)熱衷于前端技術(shù)的開發(fā)者進行交流。
本書由陶國榮主編,劉義、李建洲、李靜、裴星如、李建勤、陶紅英、陳建平、孫文華、孫義、陶林英、閔慎華、孫芳、趙剛參與了本書的編寫、素材整理及配套資源制作等工作。
由于作者水平有限,書中難免有疏漏之處,懇請各位同仁和廣大讀者給予批評指正。
陶國榮 2021年6月
第1章初識AngularJS
1.1AngularJS簡介
1.1.1AngularJS的基本語法特點
1.1.2AngularJS的適用范圍
1.1.3搭建開發(fā)AngularJS應用的環(huán)境
1.2開發(fā)簡單的AngularJS應用
1.3本章小結(jié)
第2章AngularJS基礎
2.1AngularJS中的表達式
2.1.1AngularJS表達式與JavaScript表達式的區(qū)別
2.1.2$window窗口對象在表達式中的使用
2.1.3AngularJS表達式的容錯性
2.2AngularJS中的控制器
2.2.1控制器的概念
2.2.2控制器初始化$scope對象
2.2.3添加$scope對象方法
2.2.4$scope對象屬性和方法的繼承
2.3AngularJS中的模板
2.3.1構(gòu)建模板內(nèi)容
2.3.2使用指令復制元素
2.3.3使用指令添加元素
2.3.4控制元素的顯示與隱藏狀態(tài)
2.4模板中的表單控件
2.4.1表單基本驗證功能
2.4.2表單中的checkbox和radio控件
2.4.3表單中的select控件
2.5本章小結(jié)
第3章AngularJS的過濾器和作用域
3.1模板中的過濾器
3.1.1排序方式過濾
3.1.2匹配方式過濾
3.1.3自定義過濾器
3.2過濾器的應用
3.2.1表頭排序
3.2.2字符查找
3.3作用域概述
3.3.1作用域的特點
3.3.2作為數(shù)據(jù)模型的作用域
3.4作用域的層級和事件
3.4.1作用域的層級
3.4.2作用域事件的傳播
3.5本章小結(jié)
第4章AngularJS的依賴注入
4.1依賴注入介紹
4.1.1依賴注入的原理
4.1.2簡單依賴注入的示例
4.2依賴注入標記
4.2.1推斷式注入
4.2.2標記式注入
4.2.3行內(nèi)式注入
4.3$injector常用API
4.3.1has()和get()方法
4.3.2invoke()方法
4.3.3依賴注入應用的場景
4.4本章小結(jié)
第5章AngularJS中的MVC模式
5.1MVC模式概述
5.1.1MVC簡介
5.1.2使用AngularJS中MVC的優(yōu)勢和缺點
5.2Model組件
5.2.1Model組件的基礎概念
5.2.2使用ngRepeater方式遍歷Model對象
5.3Controller組件
5.3.1控制器的屬性和方法
5.3.2控制器方法中的參數(shù)
5.3.3控制器中屬性和方法的繼承
5.4View組件
5.4.1View組件中的模板切換
5.4.2在切換視圖模板時傳參數(shù)
5.5本章小結(jié)
第6章AngularJS的服務
6.1AngularJS服務介紹
6.1.1內(nèi)置服務
6.1.2自定義服務
6.2創(chuàng)建AngularJS服務
6.2.1使用factory()方法自定義服務
6.2.2使用service()方法自定義服務
6.2.3使用constant()和value()方法自定義服務
6.3管理服務的依賴
6.3.1添加自定義服務依賴項的方法
6.3.2嵌套注入服務
6.4添加服務的其他設置
6.4.1服務的裝飾器
6.4.2服務的多例性
6.5本章小結(jié)
第7章AngularJS與服務端交互
7.1與服務端交互介紹
7.1.1傳統(tǒng)的Ajax方式與服務端交互
7.1.2使用$http快捷方式與服務端交互
7.1.3使用$http配置對象方式與服務端交互
7.2AngularJS中的緩存
7.2.1使用$cacheFactory服務創(chuàng)建緩存對象
7.2.2$http服務中的緩存
7.2.3自定義$http服務中的緩存
7.3$resource服務
7.3.1$resource服務的使用和對象中的方法
7.3.2在$resource服務中自定義請求方法
7.4promise對象
7.4.1promise的基本概念和使用方法
7.4.2promise對象在$http中的應用
7.5本章小結(jié)
第8章AngularJS的指令
8.1AngularJS指令概述
8.1.1指令定義的基礎
8.1.2設置指令對象的基礎屬性
8.2AngularJS指令對象的重要屬性
8.2.1指令對象中的transclude屬性
8.2.2指令對象中的link屬性
8.2.3指令對象中的compile屬性
8.3AngularJS指令對象的scope屬性
8.3.1scope屬性是布爾值
8.3.2scope屬性是對象
8.4AngularJS指令對象的require和controller屬性
8.4.1require和controller屬性的概念
8.4.2一個使用require和controller屬性的示例
8.5本章小結(jié)
第9章使用$location
9.1初識$location
9.1.1調(diào)用$location對象的只讀類方法
9.1.2調(diào)用$location對象的讀寫類方法
9.2$location對象的事件
9.2.1$locationChangeStart事件
9.2.2$locationChangeSuccess事件
9.3路由模式和地址變更
9.3.1標簽模式
9.3.2HTML 5模式
9.3.3路由對象方法的雙向綁定
9.4本章小結(jié)
第10章AngularJS注意事項和實踐
10.1頁面元素的控制
10.1.1調(diào)用element()方法控制DOM元素
10.1.2解決setTimeout()改變屬性的無效
10.1.3解決雙大括號綁定元素時的閃爍問題
10.2使用ngrepeat時的注意事項
10.2.1注意ngrepeat中的索引號
10.2.2使用track by對ngrepeat 中的數(shù)據(jù)排序
10.2.3正確理解ngrepeat指令中scope的繼承關系
10.3解決單擊按鈕事件中的冒泡現(xiàn)象
10.4釋放多余的$watch()監(jiān)測函數(shù)
10.5解決ngif中ngmodel值無效的問題
10.6本章小結(jié)
第11章綜合案例開發(fā)
11.1基于AngularJS使用canvas繪制圓形進度條
11.2使用AngularJS開發(fā)一個抽獎應用
11.3本章小結(jié)