揭秘Angular（第2版）

第一部分入门篇
1 前端风云 2
1．1 故事的起点 2
1．2 AJAX 王者归来 3
1．3 工具库的流行 3
1．4 百家争鸣 3
1．5 走进前端新时代 4
1．6 小结 6

2 Angular 简介 7
2．1 历史回顾 7
2．1．1 AngularJS 1．x 起源 7
2．1．2 AngularJS 1．x 迭代之路 8
2．1．3 初生的Angular 9
2．1．4 快速发展的Angular 10
2．1．5 Angular 4 和后续语义版本 11
2．1．6 开发语言之选 13
2．2 Angular 简述 14
2．2．1 核心概念 14
2．2．2 平台简介 16
2．2．3 平台亮点 18
2．3 小结 19

3 TypeScript 入门 20
3．1 TypeScript 概述 20
3．1．1 概述 20
3．1．2 安装 21
3．2 基本类型 22
3．2．1 布尔类型 22
3．2．2 数字类型 22
3．2．3 字符串类型 23
3．2．4 数组类型 23
3．2．5 元组类型 23
3．2．6 枚举类型 23
3．2．7 任意值类型 24
3．2．8 null 和undefined 24
3．2．9 void 类型 25
3．2．10 never 类型 26
3．3 声明和解构 26
3．3．1 let 声明 27
3．3．2 const 声明 28
3．3．3 解构 28
3．4 函数 30
3．4．1 函数定义 30
3．4．2 可选参数 30
3．4．3 默认参数 31
3．4．4 剩余参数 32
3．4．5 函数重载 32
3．4．6 箭头函数 33
3．5 类 34
3．5．1 类的例子 34
3．5．2 继承与多态 34
3．5．3 修饰符 35
3．5．4 参数属性 37
3．5．5 静态属性 37
3．5．6 抽象类 38
3．6 模块 39
3．6．1 概述 39
3．6．2 模块导出方式 39
3．6．3 模块导入方式 40
3．6．4 模块的默认导出 41
3．6．5 模块设计原则 42
3．7 接口 44
3．7．1 概述 44
3．7．2 属性类型接口 44
3．7．3 函数类型接口 45
3．7．4 可索引类型接口 46
3．7．5 类类型接口 46
3．7．6 接口扩展 47
3．8 装饰器 48
3．8．1 概述 48
3．8．2 方法装饰器 49
3．8．3 类装饰器 50
3．8．4 参数装饰器 52
3．8．5 属性装饰器 53
3．8．6 装饰器组合 53
3．9 泛型 55
3．10 TypeScript 周边 56
3．10．1 编译配置文件 56
3．10．2 声明文件 57
3．10．3 编码工具 58
3．10．4 展望未来 59
3．11 小结 59

4 快速入门 60
4．1 Hello World 例子 60
4．1．1 准备工作 60
4．1．2 构建项目 61
4．2 通讯录例子 66
4．2．1 背景介绍 66
4．2．2 架构设计 68
4．3 小结 74

第二部分深入篇
5 Angular 架构总览 76
5．1 核心模块介绍 76
5．1．1 组件 77
5．1．2 模板 81
5．1．3 指令 83
5．1．4 服务 84
5．1．5 依赖注入 84
5．1．6 路由 86
5．2 应用模块 89
5．3 源码结构介绍 92
5．4 小结 93

6 组件 94
6．1 概述 94
6．1．1 模块化介绍 94
6．1．2 组件化标准 96
6．1．3 Angular 的组件 99
6．2 组件基础 100
6．2．1 创建组件的步骤 100
6．2．2 组件的基础构成 101
6．2．3 组件与模块 108
6．3 组件交互 113
6．3．1 组件的输入、输出属性 113
6．3．2 父组件向子组件传递数据 114
6．3．3 子组件向父组件传递数据 120
6．3．4 其他组件交互方式 121
6．4 组件内容嵌入 124
6．5 组件生命周期 128
6．5．1 概述 128
6．5．2 生命周期钩子 128
6．6 变化监测 130
6．6．1 数据变化的源头 131
6．6．2 变动通知机制 132
6．6．3 变化监测的响应处理 134
6．7 扩展阅读 140
6．7．1 元数据一览表 140
6．7．2 元数据说明 141
6．7．3 深入理解Zone．js 150
6．7．4 不依赖Zone．js 的Angular 154
6．8 小结 155

7 模板 156
7．1 模板语法概览 156
7．2 数据绑定 158
7．2．1 概述 158
7．2．2 插值 160
7．2．3 模板表达式 160
7．2．4 属性绑定 162
7．2．5 事件绑定 165
7．2．6 双向数据绑定 168
7．2．7 输入和输出属性 169
7．3 内置指令 170
7．3．1 NgClass 170
7．3．2 NgStyle 170
7．3．3 NgIf 171
7．3．4 NgSwitch 172
7．3．5 NgFor 172
7．4 表单 173
7．4．1 模板表单例子 174
7．4．2 表单指令 175
7．4．3 自定义表单样式 184
7．4．4 表单校验 186
7．5 管道 189
7．5．1 管道介绍 189
7．5．2 内置管道 190
7．5．3 自定义管道 196
7．5．4 管道的变化监测 198
7．6 扩展阅读 202
7．6．1 安全导航操作符 202
7．6．2 双向绑定的原理 202
7．7 小结 204

8 指令 206
8．1 概述 206
8．1．1 指令分类 208
8．1．2 内置指令 210
8．2 自定义属性指令 219
8．2．1 实现属性指令 219
8．2．2 为指令绑定输入 221
8．2．3 响应用户操作 223
8．3 自定义结构指令 224
8．3．1 实现结构指令 225
8．3．2 模板标签与星号前缀 227
8．3．3 NgIf 指令原理 229
8．4 扩展阅读 231
8．5 小结 235

9 服务与RxJS 237
9．1 Angular 服务 237
9．1．1 概述 237
9．1．2 使用场景 238
9．2 HTTP 服务 242
9．2．1 HttpModule 242
9．2．2 HttpClientModule 254
9．3 响应式编程 262
9．3．1 概述 262
9．3．2 ReactiveX 264
9．4 RxJS 266
9．4．1 创建Observable 对象 266
9．4．2 使用RxJS 处理复杂场景 266
9．4．3 RxJS 和Promise 的对比 267
9．4．4 “冷”模式下的Observable 268
9．4．5 RxJS 中的Operator 269
9．4．6 Angular 中的RxJS 273
9．5 小结 277

10 依赖注入 278
10．1 依赖注入介绍 279
10．2 Angular 依赖注入 282
10．2．1 概述 282
10．2．2 在组件中注入服务 285
10．2．3 在服务中注入服务 287
10．2．4 在模块中注入服务 288
10．2．5 层级注入 290
10．2．6 注入到派生组件 295
10．2．7 限定方式的依赖注入 297
10．3 Provider 300
10．3．1 概述 300
10．3．2 Provider 注册方式 302
10．4 扩展阅读 305
10．5 小结 308

11 路由 309
11．1 概述 309
11．2 基本用法 311
11．2．1 路由配置 311
11．2．2 创建根路由模块 312
11．2．3 添加RouterOutlet 指令 312
11．3 路由策略 313
11．3．1 HashLocationStrategy 介绍 314
11．3．2 PathLocationStrategy 介绍 315
11．4 路由跳转 316
11．4．1 使用指令跳转 317
11．4．2 使用代码跳转 319
11．5 路由参数 321
11．5．1 Path 参数 321
11．5．2 Query 参数 324
11．5．3 Matrix 参数 326
11．6 子路由和附属Outlet 326
11．6．1 子路由 326
11．6．2 附属Outlet 328
11．7 路由拦截 330
11．7．1 激活拦截与反激活拦截 330
11．7．2 数据预加载拦截 334
11．8 模块的延迟加载 337
11．8．1 延迟加载实现 337
11．8．2 模块预加载 339
11．8．3 模块加载拦截 341
11．9 小结 342

12 测试 343
12．1 概述 343
12．2 单元测试 344
12．2．1 概述 344
12．2．2 常用测试框架 345
12．2．3 Jasmine 介绍 345
12．2．4 Karma 介绍 350
12．2．5 Karma 结合Jasmine 测试 350
12．3 Angular 单元测试 355
12．3．1 概述 355
12．3．2 独立单元测试 358
12．3．3 测试工具集 362
12．4 端到端测试 370
12．4．1 概述 370
12．4．2 Protractor 介绍 371
12．5 小结 374

第三部分实战篇
13 问卷调查系统简介 376
13．1 项目背景 376
13．2 主要特性 377
13．2．1 首页和帮助页 378
13．2．2 问卷编辑页 378
13．2．3 我的问卷页 378
13．2．4 用户管理页 379
13．3 产品设计 379
13．4 小结 380

14 项目起步 381
14．1 Angular CLI 381
14．1．1 简介 381
14．1．2 常用命令介绍 382
14．2 其他技术选型 391
14．2．1 UI 样式库 391
14．2．2 后端服务器 391
14．3 环境搭建 392
14．3．1 搭建前端环境 392
14．3．2 引入样式库 393
14．3．3 搭建后端环境 394
14．4 目录结构介绍 396
14．5 首页开发 397
14．6 导航栏开发 401
14．7 小结 402

15 问卷编辑模块 403
15．1 概述 403
15．1．1 特性管理模块 403
15．1．2 功能设计 406
15．1．3 数据模型 407
15．2 问卷编辑模块开发 410
15．2．1 问题选择组件 410
15．2．2 问题组件 414
15．2．3 问卷组件 425
15．2．4 问卷服务 431
15．2．5 问卷大纲组件 438
15．3 小结 441

16 我的问卷模块 442
16．1 问卷列表 443
16．1．1 问卷列表项 443
16．1．2 显示问卷列表 445
16．1．3 显示问卷详情 447
16．2 问卷操作 449
16．2．1 发布后的问卷页面 450
16．2．2 问卷操作组件 453
16．3 小结 456

17 用户管理模块 457
17．1 开发简单注册页 458
17．2 表单控件组件 460
17．2．1 定义表单控件 460
17．2．2 校验表单控件 461
17．2．3 表单安全 464
17．3 用户注册功能开发 465
17．3．1 用户注册服务 465
17．3．2 组件的逻辑 466
17．3．3 注册接口开发 469
17．4 权限管理 470
17．5 小结 473

18 项目构建和最佳实践 475
18．1 项目构建 475
18．1．1 代码质量检查 475
18．1．2 测试 476
18．1．3 打包 478
18．1．4 容器化 479
18．2 最佳实践 479
18．2．1 单一职责 480
18．2．2 命名约定 480
18．2．3 编码约定 483
18．2．4 Angular 模块约定 487
18．2．5 组件相关约定 487
18．2．6 指令相关约定 489
18．2．7 服务相关约定 490
18．2．8 其他 491
18．3 小结 492

第四部分延伸篇
19 移动开发框架：ionic 介绍与实战 494
19．1 移动开发 494
19．1．1 背景介绍 494
19．1．2 四种开发模式 495
19．1．3 技术选型 495
19．2 ionic 平台介绍 496
19．2．1 概览 496
19．2．2 Cordova 498
19．2．3 环境搭建 499
19．2．4 组件开发 501
19．2．5 路由和导航 503
19．3 ionic Native 507
19．3．1 插件介绍 507
19．3．2 插件使用 508
19．3．3 插件开发 509
19．4 样式和主题 509
19．4．1 平台样式 509
19．4．2 主题 511
19．4．3 全局变量 512
19．4．4 工具属性 513
19．4．5 Iconfont 514
19．5 ionic CLI 515
19．6 通讯录实例 518
19．6．1 项目搭建 519
19．6．2 主页面 520
19．7 小结 525

20 服务端渲染 527
20．1 概述 527
20．2 客户端渲染的局限性 528
20．3 服务端渲染的局限性 529
20．4 Angular Universal 介绍 531
20．5 将通讯录例子改造成Angular Universal 的方式 533
20．6 服务端渲染的进阶实践 540
20．6．1 服务端数据的同步 541
20．6．2 使用依赖注入解决环境差异 544
20．6．3 使用Preboot 解决事件脱节 546
20．7 小结 549