这是一本实战性的Angular.js入门教程,系统讲解了Angular.js的各项功能特点和基本使用,配有大量小案例和2个大案例。
全书一共11章:第1章对Angular.js做了简要介绍,第2~9章详细讲解了Angular.js的表达式与模板、数据绑定与作用域、依赖注入、MVC模式、服务、与服务端交互、指令、$location等主要内容;第10章讲解了开发中的注意事项和最佳实践;第11章是两个综合性的案例。
封面图
目录
- 前言
- 第1章初识Angular1
- 1.1Angular简介1
- 1.1.1特点2
- 1.1.2适用范围2
- 1.1.3搭建开发Angular应用的环境2
- 1.2开发简单的Angular应用3
- 示例1-1编写一个简单的Angular程序3
- 示例1-2编写一个具有计算功能的Angular程序4
- 示例1-3编写一个绑定页面元素的Angular程序6
- 示例1-4编写一个绑定多个页面元素的Angular程序7
- 1.3本章小结9
- 第2章Angular基础知识10
- 2.1 Angular中的表达式10
- 2.1.1Angular表达式与JavaScript表达式的区别10
- 示例2-1Angular表达式与JavaScript表达式之间的相互调用11
- 2.1.2$window窗口对象在表达式中的使用13
- 示例2-2$window窗口对象在表达式中的使用13
- 2.1.3Angular表达式的容错性14
- 示例2-3Angular表达式的容错性14
- 2.2Angular中的控制器16
- 2.2.1控制器的概念16
- 2.2.2控制器初始化$scope对象16
- 示例2-4控制器初始化$scope对象16
- 2.2.3添加$scope对象方法18
- 示例2-5通过表达式绑定$scope对象的方法18
- 示例2-6在事件中绑定$scope对象的方法20
- 示例2-7添加带参数的$scope方法21
- 2.2.4$scope对象属性和方法的继承23
- 示例2-8$scope对象中方法和属性的继承23
- 2.3Angular中的模板24
- 2.3.1构建模板内容25
- 示例2-9构建模板内容25
- 2.3.2使用指令复制元素26
- 示例2-10使用指令复制元素26
- 2.3.3添加元素样式29
- 示例2-11添加元素样式30
- 2.3.4控制元素的隐藏与显示状态33
- 示例2-12控制元素的隐藏与显示状态33
- 2.4模板中的表单控件35
- 2.4.1表单基本验证功能35
- 示例2-13表单基本验证功能35
- 2.4.2表单中的checkbox和radio控件37
- 示例2-14 表单中的checkbox和radio控件38
- 2.4.3表单中的select控件39
- 示例2-15表单中的select控件41
- 2.5本章小结43
- 第3章Angular的过滤器和作用域44
- 3.1模板中的过滤器44
- 3.1.1排序方式过滤44
- 示例3-1排序方式过滤45
- 3.1.2匹配方式过滤48
- 示例3-2匹配方式过滤49
- 3.1.3自定义过滤器51
- 示例3-3自定义过滤器51
- 3.2过滤器的应用54
- 3.2.1表头排序55
- 示例3-4表头排序55
- 3.2.2字符查找57
- 示例3-5字符查找58
- 3.3作用域概述60
- 3.3.1作用域特点60
- 示例3-6$watch方法的使用60
- 3.3.2作为数据模型的作用域62
- 示例3-7作为数据模型的作用域62
- 3.4作用域的层级和事件64
- 3.4.1作用域的层级64
- 示例3-8作用域的层级64
- 3.4.2作用域事件的传播67
- 示例3-9作用域事件的传播69
- 3.5本章小结71
- 第4章Angular的依赖注入72
- 4.1依赖注入介绍72
- 4.1.1依赖注入的原理72
- 示例4-1依赖注入的原理73
- 4.1.2简单依赖注入的示例75
- 示例4-2简单依赖注入的示例75
- 4.2依赖注入标记78
- 4.2.1推断式注入78
- 示例4-3推断式注入的示例78
- 4.2.2标记式注入79
- 示例4-4标记式注入的示例80
- 4.2.3行内式注入82
- 示例4-5行内式注入的示例82
- 4.3$injector常用API84
- 4.3.1has和get方法84
- 示例4-6has和get方法的示例84
- 4.3.2invoke方法86
- 示例4-7invoke方法的示例86
- 4.3.3依赖注入应用的场景88
- 4.4本章小结89
- 第5章Angular中MVC模式90
- 5.1MVC模式概述90
- 5.1.1MVC简介90
- 5.1.2使用Angular中MVC的优势和缺点91
- 5.2Model组件92
- 5.2.1Model组件的基础概念92
- 示例5-1Model组件的基础概念92
- 5.2.2使用ngRepeater方式遍历Model对象94
- 示例5-2使用ngRepeater方式遍历Model对象94
- 5.3Controller组件96
- 5.3.1控制器的属性和方法96
- 示例5-3控制器的属性和方法96
- 5.3.2控制器方法中的参数98
- 示例5-4控制器方法中的参数98
- 5.3.3控制器中属性和方法的继承100
- 示例5-5控制器中属性和方法的继承100
- 5.4View组件103
- 5.4.1View组件中的模板切换103
- 示例5-6View组件中的模板切换103
- 5.4.2在切换视图模板时传参数106
- 示例5-7多页面切换并传递参数106
- 5.5本章小结109
- 第6章Angular的服务110
- 6.1Angular服务介绍110
- 6.1.1内置服务110
- 示例6-1内置服务调用111
- 6.1.2自定义服务112
- 示例6-2使用$provide自定义服务113
- 6.2创建Angular服务115
- 6.2.1使用factory方法自定义服务115
- 示例6-3使用factory方法自定义服务115
- 6.2.2使用service方法自定义服务117
- 示例6-4使用service方法自定义服务117
- 6.2.3使用constant和value方法自定义服务119
- 示例6-5使用constant和value方法自定义服务120
- 6.3管理服务的依赖122
- 6.3.1添加自定义服务依赖项方法122
- 示例6-6添加自定义服务依赖项方法122
- 6.3.2嵌套注入服务124
- 示例6-7嵌套注入服务125
- 6.4添加服务的其他设置127
- 6.4.1服务的装饰器127
- 示例6-8服务的装饰器127
- 6.4.2服务的多例性129
- 示例6-9服务的多例性129
- 6.5本章小结132
- 第7章Angular与服务端交互133
- 7.1与服务端交互介绍133
- 7.1.1传统的AJAX方式与服务端交互134
- 示例7-1传统的AJAX方式与服务端交互134
- 7.1.2使用$http快捷方法与服务端交互137
- 示例7-2使用$http快捷方法与服务端交互137
- 7.1.3使用$http配置对象方式与服务端交互139
- 示例7-3使用$http配置对象方式与服务端交互140
- 7.2Angular中的缓存143
- 7.2.1$cacheFactory服务创建缓存对象143
- 示例7-4$cacheFactory服务创建缓存对象144
- 7.2.2$http服务中的缓存146
- 示例7-5$http服务中的缓存146
- 7.2.3自定义$http服务中的缓存148
- 示例7-6自定义$http服务中的缓存148
- 7.3$resource服务150
- 7.3.1$resource服务的使用和对象中的方法150
- 示例7-7$resource对象中方法的使用152
- 7.3.2在$resource服务中自定义请求方法155
- 示例7-8$resource服务中自定义方法155
- 7.4promise对象159
- 7.4.1promise的基本概念和使用方法159
- 示例7-9promise对象的创建和使用160
- 7.4.2promise对象在$http中的应用162
- 示例7-10promise对象在$http中的应用162
- 7.5本章小结164
- 第8章Angular的指令165
- 8.1Angular指令概述165
- 8.1.1指令定义的基础165
- 示例8-1创建一个新的指令166
- 8.1.2设置指令对象的基础属性168
- 示例8-2设置指令对象的基础属性168
- 8.2Angular指令对象的重要属性170
- 8.2.1指令对象中的transclude属性170
- 示例8-3设置指令对象中的transclude属性171
- 8.2.2指令对象中的link属性173
- 示例8-4设置指令对象中的link属性173
- 8.2.3指令对象中的compile属性175
- 示例8-5设置指令对象中的compile属性175
- 8.3Angular指令对象的scope属性177
- 8.3.1scope属性是布尔值178
- 示例8-6scope属性是布尔值178
- 8.3.2scope属性是对象180
- 示例8-7scope属性是JSON对象181
- 8.4Angular指令对象的require和controller属性183
- 8.4.1require和controller属性的概念184
- 8.4.2一个使用require和controller属性的示例184
- 示例8-8一个使用require和controller属性的示例184
- 8.5本章小结187
- 第9章使用$location188
- 9.1初识$location188
- 9.1.1调用$location对象的只读方法188
- 示例9-1调用$location对象的只读方法189
- 9.1.2调用$location对象的读写类方法190
- 示例9-2调用$location对象的读写方法191
- 9.2$location对象的事件193
- 9.2.1$locationChangeStart事件193
- 示例9-3捕捉$locationChangeStart事件193
- 9.2.2$locationChangeSuccess事件195
- 示例9-4捕捉locationChange-Success事件195
- 9.3路由模式和地址变更197
- 9.3.1标签(hashbang)模式198
- 示例9-5标签模式下获取页面URL中的内容198
- 9.3.2HTML 5模式200
- 示例9-6HTML 5模式下获取页面URL中的内容200
- 9.3.3模式间的区别与关联202
- 示例9-7两种模式下分别获取页面URL中的内容203
- 9.3.4路由对象方法的双向绑定206
- 示例9-8路由对象方法的双向绑定207
- 9.4本章小结208
- 第10章使用Angular开发的注意事项和最佳实践209
- 10.1页面元素的控制209
- 10.1.1调用element方法控制DOM元素209
- 示例10-1调用element方法控制DOM元素210
- 10.1.2解决setTimeout改变属性的无效212
- 示例10-2解决setTimeout改变属性的无效212
- 10.1.3解决双大括号绑定元素时的闪烁问题214
- 示例10-3解决双大括号绑定元素时的闪烁问题214
- 10.2使用ng-repeat时的注意事项216
- 10.2.1注意ng-repeat中的索引号216
- 示例10-4注意ng-repeat中的索引号216
- 10.2.2使用track by排序ng-repeat中的数据219
- 示例10-5使用track by排序ng-repeat中的数据219
- 10.2.3正确理解ng-repeat指令中scope的继承关系222
- 示例10-6正确理解ng-repeat指令中scope的继承关系222
- 10.3解决单击按钮事件中的冒泡现象225
- 示例10-7解决单击按钮事件中的冒泡现象225
- 10.4释放多余的$watch监测函数227
- 示例10-8释放多余的$watch监测函数227
- 10.5解决ng-if中ng-model值无效的问题229
- 示例10-9解决ng-if中ng-model值无效的问题230
- 10.6本章小结231
- 第11章综合案例开发232
- 11.1基于AngularJS使用canvas绘制圆形进度条232
- 11.1.1需求分析232
- 11.1.2界面效果233
- 11.1.3功能开发233
- 11.1.4源码解析238
- 11.2使用AngularJS开发一个抽奖应用240
- 11.2.1需求分析240
- 11.2.2界面效果240
- 11.2.3功能开发241
- 11.2.4源码解析247
- 11.3本章小结251