作者：[美]JeremyWilken 日期：2017-04-25 00:00:18
Ionic是近几年很火的一项跨平台开发技术。Ionic最大的亮点是集成了Angular和Cordova，对于有开发经验的前端工程师来说上手难度大大降低，并且能直接使用现有的大量第三方库和框架。《Ionic实战：基于AngularJS的移动混合应用开发》是一本详尽的Ionic实战教程，不仅告诉你“怎么做”，还告诉你“为什么”，这正是大部分入门书籍所欠缺的。
无论你是否有相关开发经验，《Ionic实战：基于AngularJS的移动混合应用开发》都可以帮助你快速掌握Ionic。
目录：
第1章 Ionic和Hybrid应用介绍 ...................................................................................... 1
1.1 Ionic是什么 .......................................................................................................... 2
1.2 移动开发类型 ...................................................................................................... 3
1.2.1 原生移动应用 .......................................................................................... 4
1.2.2 移动端网站（Web 应用） ........................................................................ 5
1.2.3 Hybrid 应用 .............................................................................................. 6
1.3 理解Ionic技术栈 .................................................................................................. 7
1.3.1 Ionic ：用户界面框架 .............................................................................. 8
1.3.2 Angular ：Web 应用框架 ....................................................................... 10
1.3.3 Cordova ：Hybrid 应用框架 .................................................................. 10
1.4 为什么选择Ionic ................................................................................................ 11
1.4.1 开发者为什么要选择Ionic ................................................................... 11
1.4.2 Ionic 的缺点 ........................................................................................... 12
1.5 使用Ionic构建应用的前提 ................................................................................ 13
1.5.1 掌握HTML、CSS 和java script .......................................................... 13
1.5.2 掌握Web 应用和Angular ..................................................................... 13
1.5.3 拥有移动设备 ........................................................................................ 14
1.6 Ionic支持的移动设备和平台 ............................................................................ 14
1.6.1 苹果的iOS ............................................................................................. 14
1.6.2 谷歌的Android ...................................................................................... 15
1.7 总结 .................................................................................................................... 16
第2章 配置开发环境 .................................................................................................. 17
2.1 快速上手 ............................................................................................................ 18
2.1.1 设置开发环境 ........................................................................................ 18
2.1.2 创建一个新项目 .................................................................................... 21
2.1.3 项目文件夹结构 .................................................................................... 22
2.1.4 在浏览器中预览 .................................................................................... 23
2.2 配置预览环境 .................................................................................................... 24
2.2.1 安装平台工具 ........................................................................................ 25
2.2.2 配置模拟器 ............................................................................................ 26
2.2.3 配置连接设备 ........................................................................................ 31
2.2.4 给项目添加平台 .................................................................................... 32
2.2.5 在模拟器中预览 .................................................................................... 32
2.2.6 在移动设备上预览 ................................................................................ 33
2.3 总结 .................................................................................................................... 35
第3章 AngularJS必备知识 ......................................................................................... 37
3.1 AngularJS初探 ................................................................................................... 39
3.1.1 视图和模板：描述内容 ........................................................................ 39
3.1.2 控制器、模型和作用域：管理数据和逻辑 ........................................ 41
3.1.3 Service ：可重用的对象和方法 ............................................................ 43
3.1.4 双向数据绑定：在控制器和视图之间共享数据 ................................ 43
3.2 配置本章的项目 ................................................................................................ 43
3.2.1 获取项目文件 ........................................................................................ 44
3.2.2 启动开发服务器 .................................................................................... 44
3.3 Angular应用基础 ............................................................................................... 46
3.4 控制器：控制数据和业务逻辑 ........................................................................ 47
3.5 加载数据：使用控制器来加载数据并显示在视图中 .................................... 50
3.5.1 过滤器：转换视图中的数据 ................................................................ 53
3.6 处理选择笔记的单击事件 ................................................................................ 54
3.7 创建一个指令，用来解析Markdown格式的笔记 ........................................... 56
3.8 使用模型来管理内容编辑 ................................................................................ 59
3.9 保存和删除笔记 ................................................................................................ 62
3.9.1 添加save() 方法 .................................................................................... 63
3.9.2 使用Angular 表单进行验证 ................................................................. 64
3.9.3 添加和删除方法 .................................................................................... 64
3.10 继续学习Angular ............................................................................................. 65
3.11 挑战................................................................................................................... 66
3.12 总结 .................................................................................................................. 66
第4章 Ionic导航和核心组件 ....................................................................................... 68
4.1 配置项目 ............................................................................................................ 70
4.1.1 创建一个新应用并手动添加代码 ........................................................ 70
4.1.2 克隆完整版应用 .................................................................................... 70
4.2 配置应用导航 .................................................................................................... 70
4.2.1 设计良好的应用导航 ............................................................................ 72
4.2.2 使用状态管理器来声明应用视图 ........................................................ 73
4.3 构建主视图 ........................................................................................................ 77
4.3.1 创建内容容器 ........................................................................................ 77
4.3.2 使用CSS 组件并添加一个简单的链接列表 ....................................... 78
4.3.3 给列表元素添加图标 ............................................................................ 80
4.4 使用控制器和模型来开发预订视图 ................................................................ 81
4.5 把数据加载到天气视图中 ................................................................................ 85
4.5.1 给天气视图添加模板 ............................................................................ 86
4.5.2 创建天气控制器加载外部数据 ............................................................ 87
4.5.3 给天气视图添加一个载入指示器 ........................................................ 89
4.6 在餐馆视图中使用卡片和无限滚动 ................................................................ 91
4.7 使用幻灯片组件来实现应用介绍 .................................................................... 94
4.8 挑战 .................................................................................................................... 97
4.9 总结 .................................................................................................................... 98
第5章 选项卡、高级列表和表单组件 ......................................................................... 99
5.1 配置本章的项目 .............................................................................................. 101
5.1.1 手动创建项目并添加代码 .................................................................. 101
5.1.2 克隆完整项目 ...................................................................................... 101
5.2 ionTabs：添加选项卡和导航 .......................................................................... 101
5.2.1 给应用添加选项卡容器和三个选项卡 .............................................. 103
5.3 给每个选项卡添加ionNavView ...................................................................... 104
5.4 加载并显示当前的比特币汇率 ...................................................................... 109
5.5 在同一个选项卡视图中显示货币细节 .......................................................... 114
5.6 刷新比特币汇率并显示帮助信息 .................................................................. 117
5.6.1 IonRefresher ：下拉刷新汇率 ............................................................. 118
5.6.2 $IonicPopover ：弹出帮助信息........................................................... 120
5.7 绘制历史数据 .................................................................................................. 123
5.7.1 配置第三方库 ...................................................................................... 123
5.7.2 历史信息选项卡模板：使用Highcharts 和下拉列表来切换货币... 124
5.7.3 历史信息选项卡控制器：加载数据并配置图表 .............................. 125
5.8 货币选项卡：支持重新排序和开关 .............................................................. 129
5.8.1 IonReorderButton ：让列表支持重新排序 ......................................... 129
5.8.2 IonToggle ：给列表元素添加开关 ...................................................... 131
5.9 挑战 .................................................................................................................. 132
5.10 总结 ................................................................................................................ 132
第6章 使用Ionic开发一款天气应用 ............................................................................ 134
6.1 项目配置 .......................................................................................................... 135
6.2 设置侧滑菜单和视图 ...................................................................................... 136
6.3 地理位置搜索 .................................................................................................. 139
6.4 增加设置视图和数据的服务 .......................................................................... 142
6.4.1 创建收藏地点和设置服务 .................................................................. 142
6.4.2 在侧滑菜单列表中显示收藏的地点 .................................................. 144
6.4.3 增加设置视图模板 .............................................................................. 145
6.4.4 设置视图控制器 .................................................................................. 147
6.5 设置天气视图 .................................................................................................. 148
6.5.1 获取 Forecast.io API 密钥 ................................................................... 148
6.5.2 使用 Ionic 命令行代理 ........................................................................ 149
6.5.3 增加天气视图的控制器和模板 .......................................................... 150
6.6 ionScroll：制作自定义滚动内容组件 ............................................................ 151
6.6.1 在页面中使用 ionScroll ...................................................................... 152
6.6.2 为天气数据查询创建过滤器 .............................................................. 158
6.7 活动菜单列表：显示可选列表 ...................................................................... 160
6.8 ionModal：显示日出和日落数据表 ............................................................... 162
6.8.1 配置弹窗 .............................................................................................. 164
6.8.2 数据列表集：让日出和日落时间列表显示得更快 .......................... 166
6.9 弹框：提示并确认收藏地点修改 .................................................................. 169
6.10 挑战 ................................................................................................................ 171
6.11 总结................................................................................................................. 172
第7章 开发高级应用 ................................................................................................ 173
7.1 配置本章项目 .................................................................................................. 174
7.1.1 获取代码 .............................................................................................. 174
7.2 使用 Sass 自定义 Ionic 样式 ........................................................................... 174
7.2.1 设置 Sass .............................................................................................. 175
7.2.2 使用 Sass 变量自定义 Ionic ................................................................ 176
7.2.3 使用 Sass 编写样式 ............................................................................. 177
7.3 如何支持联网和离线模式 .............................................................................. 178
7.4 处理手势事件 .................................................................................................. 180
7.4.1 使用 Ionic 事件指令监听事件 ............................................................ 180
7.4.2 使用 $ionicGesture 服务监听事件 ...................................................... 182
7.4.3 支持的手势事件 .................................................................................. 185
7.5 数据持久化 ...................................................................................................... 186
7.5.1 使用 localStorage ................................................................................. 187
7.5.2 使用 Web SQL、IndexedDB 和 SQLite ............................................. 189
7.5.3 Cordova 插件提供的其他选项 ........................................................... 190
7.6 制作跨平台的应用 .......................................................................................... 191
7.6.1 一种尺寸并不能满足所有情况 .......................................................... 191
7.6.2 根据平台或者设备类型适配样式 ...................................................... 192
7.6.3 为平台和设备类型适配交互 .............................................................. 194
7.7 使用 $ionicConfigProvider编辑默认交互行为 ............................................... 196
7.8 总结 .................................................................................................................. 197
第8章 使用Cordova插件 .......................................................................................... 198
8.1 Cordova 插件 .................................................................................................... 199
8.1.1 使用插件要考虑的问题 ...................................................................... 200
8.1.2 安装插件 .............................................................................................. 201
8.1.3 使用插件 .............................................................................................. 201
8.1.4 在模拟器中使用插件 .......................................................................... 202
8.1.5 插件和系统限制 .................................................................................. 203
8.1.6 Angular 和 Cordova 陷阱 .................................................................... 203
8.1.7 关于设备和模拟器的一些常见问题解决办法 .................................. 205
8.2 ngCordova ......................................................................................................... 207
8.2.1 安装 ngCordova ................................................................................... 207
8.3 在应用中使用相机和相册插件 ...................................................................... 208
8.3.1 创建相机应用 ...................................................................................... 208
8.3.2 增加相机插件 ...................................................................................... 209
8.3.3 创建相册视图 ...................................................................................... 210
8.4 在天气应用中使用地理位置 .......................................................................... 212
8.4.1 配置地理位置插件示例 ...................................................................... 213
8.4.2 添加地理位置插件和 ngCordova ....................................................... 214
8.4.3 请求用户的地理位置 .......................................................................... 214
8.4.4 优化天气应用 ...................................................................................... 216
8.5 本章挑战 .......................................................................................................... 218
8.6 总结 .................................................................................................................. 219
第9章 预览、调试和自动化测试 .............................................................................. 220
9.1 预览、调试和测试之间的区别 ...................................................................... 220
9.1.1 为什么测试如此重要 .......................................................................... 222
9.2 配置本章示例 .................................................................................................. 222
9.3 预览应用的其他方法 ...................................................................................... 223
9.3.1 Ionic Lab ............................................................................................... 223
9.3.2 Ionic View ............................................................................................ 224
9.4 使用真机调试 .................................................................................................. 226
9.4.1 在 Android 设备上进行调试 ............................................................... 227
9.4.2 在 iOS 或模拟器中进行调试 .............................................................. 229
9.5 自动化测试 ...................................................................................................... 232
9.5.1 使用 Jasmine 和 Karma 进行单元测试 .............................................. 233
9.5.2 使用 Protractor 和 WebDriver 进行集成测试 .................................... 240
9.6 更多的测试示例 .............................................................................................. 245
9.7 总结 .................................................................................................................. 245
第10章 编译并发布应用 ........................................................................................... 246
10.1 创建应用过程一览 ........................................................................................ 247
10.2 创建应用图标和启动页面图片 .................................................................... 248
10.2.1 创建图标 .......................................................................................... 249
10.2.2 创建启动页面图片 .......................................................................... 250
10.3 准备上线应用 ................................................................................................ 251
10.4 编译 Android 应用并发布到 Google Play .................................................... 252
10.4.1 配置应用的签名 .............................................................................. 252
10.4.2 编译应用文件 .................................................................................. 253
10.4.3 签名应用文件 .................................................................................. 253
10.4.4 优化 APK 文件 ................................................................................ 254
10.4.5 编译应用的升级版本 ...................................................................... 254
10.4.6 创建应用清单并将应用上传到 Play Store .................................... 255
10.4.7 升级应用清单或上传新版本 .......................................................... 256
10.4.8 选择 Android 商店 ........................................................................... 256
10.5 编译 iOS 应用并发布到 AppStore ................................................................ 257
10.5.1 配置认证和 ID ................................................................................. 257
10.5.2 配置应用的 ID 标识 ........................................................................ 258
10.5.3 在 iTunes Connect 中创建应用清单 ............................................... 259
10.5.4 使用 Xcode 编译并上传应用 .......................................................... 259
10.5.5 完善 iTunes Connect 应用清单信息 ............................................... 260
10.5.6 更新应用 .......................................................................................... 261
10.6 总结 ................................................................................................................ 261
附录A 相关资源 ....................................................................................................... 263