AngularJS从入门到项目实战

第1章 Angular 的基础知识         001
1.1 Angular简介     001
1.1.1　AngularJS是什么       001
1.1.2　Angular 和AngularJS的区别        002
1.1.3　Angular的发展历程           002
1.2 环境搭建          003
1.2.1　安装Node.js        003
1.2.2　安装Angular-cli         006
1.2.3　安装开发工具     007
1.3 创建个项目       009
1.3.1　创建项目      009
1.3.2　运行项目      010
1.3.3　项目结构介绍     011
第2章 TypeScript基础知识        014
2.1 基础类型          014
2.2 变量声明          017
2.2.1　var声明        017
2.2.2　let声明          019
2.3 类     021
2.3.1　属性     021
2.3.2　方法     022
2.3.3　构造函数      023
2.3.4　继承     024
2.3.5　修饰符          025
2.4 函数           027
2.4.1　函数类型      028
2.4.2　可选参数和默认参数         029
2.4.3　剩余参数      030
第3章 熟悉模板语法            031
3.1 模板中的HTML       031
3.2 插值与模板表达式   032
3.2.1　插值表达式         032
3.2.2　模板表达式         033
3.2.3　表达式上下文     033
3.3 模板语句          034
3.4 绑定语法          035
3.5 属性绑定([属性名])         036
3.5.1　单向输入      037
3.5.2　绑定目标      037
3.5.3　选择属性绑定还是插值     038
3.6 attribute、class和style绑定         038
3.6.1　attribute绑定       039
3.6.2　CSS类绑定         040
3.6.3　样式绑定      040
3.7 事件绑定(event)     041
3.8 双向数据绑定([(  )])         042
3.9 内置模板函数          046
3.10 生命周期        046
第4章 精通核心组件            049
4.1 了解组件          049
4.1.1　创建组件      049
4.1.2　导入依赖      051
4.1.3　Component 注解         051
4.1.4　添加template       052
4.1.5　用styleUrls 添加CSS 样式       052
4.2 挂载组件          053
4.3 组件中的模板          054
4.3.1　绑定数据      054
4.3.2　绑定属性      056
4.3.3　绑定HTML         057
4.3.4　引入图片      058
4.4 父子组件之间的通信         058
4.4.1　父组件给子组件传值         059
4.4.2　父组件通过@ViewChild 主动获取子组件的数据和方法        062
第5 章 玩转核心指令             064
5.1 内置指令          064
5.1.1　ngIf       064
5.1.2　ngSwitch       065
5.1.3　ngStyle          066
5.1.4　ngClass          067
5.1.5　ngFor             068
5.1.6　ngNonBindable           071
5.2 自定义指令      072
5.3 案例实战：实现任务“备忘录”     073
第6 章 转换数据的管道               076
6.1 使用管道          076
6.2 内置的管道       077
6.2.1　大小写转换管道        077
6.2.2　日期格式转换管道    078
6.2.3　小数位数管道     078
6.2.4　货币管道      079
6.2.5　对象序列化管道        080
6.2.6　slice 管道             080
6.3 管道参数          081
6.4 链式管道          082
6.5 自定义管道       083
6.5.1　实现自定义管道        083
6.5.2　组合双向数据绑定    085
第7 章 表单的应用     087
7.1 Angular 表单简介    087
7.2 响应式表单      089
7.2.1　添加表单控件     090
7.2.2　管理控件的值     091
7.2.3　把表单控件分组        092
7.2.4　保存表单数据     094
7.2.5　嵌套的表单组     095
7.2.6　部分模型更新     097
7.2.7　使用FormBuilder 生成表单控件     098
7.2.8　表单验证      099
7.2.9　使用表单数组管理动态控件    101
7.2.10　响应式表单API       103
7.3 模板驱动表单          104
第8 章 精通组件跳转的路由          112
8.1 路由的意义        112
8.2 路由的定义        113
8.2.1　创建带路由的项目    113
8.2.2　routerLinkActive 指令         116
8.3 路由嵌套（父子路由）      116
8.4 路由的对象       120
8.5 辅助路由          123
8.6 路由守卫          126
8.6.1　CanActivate 守卫        127
8.6.2　CanDeactivate      128
第9 章 自定义服务及DOM 操作           130
9.1 自定义服务       130
9.1.1　仿APP 搜索缓存数据功能      130
9.1.2　实现任务备忘录功能         132
9.2 DOM 操作        134
9.2.1　原生JS 操作DOM    134
9.2.2　使用ViewChild 操作DOM       136
9.2.3　父子组件中通过ViewChild 调用子组件的方法     137
9.2.4　实现轮播图效果        139
第10 章 模块和懒加载           143
10.1 自定义模块     143
10.1.1　自定义模块的意义  144
10.1.2　自定义一个模块      145
10.1.3　在自定义模块中创建组件      146
10.1.4　挂载自定义模块及组件          147
10.1.5　自定义模块访问自身组件      149
10.2 配置路由模块懒加载       150
10.2.1　创建懒加载项目      150
10.2.2　实现模块懒加载      151
10.2.3　在子模块中配置路由       153
第11 章 借用Bootstrap 的组件           156
11.1 配置环境         156
11.2 按钮组件         157
11.2.1　定义按钮            158
11.2.2　设计按钮风格           158
11.3 按钮组组件     161
11.3.1　定义按钮组        161
11.3.2　定义按钮组工具栏   162
11.3.3　设计按钮组布局和样式           163
11.4 导航组件         165
11.4.1　定义导航            165
11.4.2　设计导航的布局       166
11.4.3　设计导航的风格       167
11.4.4　设计导航选项卡       170
11.5 徽章         172
11.5.1　定义徽章            172
11.5.2　设置颜色            174
11.5.3　椭圆形徽章        174
11.6 警告框            175
11.6.1　定义警告框        175
11.6.2　添加链接            177
11.6.3　关闭警告框        178
11.7 进度条            178
11.7.1　定义进度条        179
11.7.2　设计进度条样式       179
11.7.3　设计进度条风格       181
11.8 列表组            183
11.8.1　定义列表组        183
11.8.2　设计列表组的风格样式           184
11.8.3　定制内容            187
11.9 面包屑            188
11.9.1　定义面包屑        188
11.9.2　设计分隔符        189
11.10 分页       190
11.10.1　定义分页          190
11.10.2　使用图标          191
11.10.3　设计分页风格         192
11.11 旋转器特效          195
11.11.1　定义旋转器      195
11.11.2　设计旋转器风格     196
11.11.3　对齐旋转器      198
11.11.4　按钮旋转器      199
11.12 卡片       200
11.12.1　定义卡片          200
11.12.2　卡片风格          201
第12 章 摄影相册      204
12.1 项目概述        204
12.1.1　设计效果           204
12.1.2　设计准备           207
12.2 设计导航栏     207
12.3 首页         209
12.3.1　设计相册展示          209
12.3.2　添加Swipebox 灯箱插件        211
12.4 分类页            214
12.4.1　设计相册分类展示  214
12.4.2　添加Swipebox 灯箱插件        217
12.5 博客         219
12.6 联系页            220
12.7 项目重要文件        222
12.7.1　根模块（app.module.ts）        222
12.7.2　路由文件（app-routing.module.ts）        223
第13 章 Web 设计与定制网站             224
13.1 网站概述        224
13.1.1　网站布局           224
13.1.2　设计准备           224
13.2 设计主页面导航     224
13.3 设计主页面内容     227
13.3.1　设计首页           227
13.3.2　关于我们           229
13.3.3　我们的团队       230
13.3.4　我们的服务       233
13.3.5　我们的博客       234
13.3.6　我们的定制       235
13.4 设计脚注        237
第14 章 仿星巴克网站           239
14.1 网站概述        239
14.1.1　设计效果           239
14.1.2　设计准备           240
14.2 设计首页布局        241
14.3 设计可切换导航     242
14.4 主体内容        247
14.4.1　设计轮播广告区      248
14.4.2　设计产品推荐区      249
14.4.3　设计登录注册和logo       250
14.4.4　设计特色展示区      251
14.4.5　设计产品生产流程区       253
14.5 设计底部隐藏导航          255
第15 章 仿支付宝“淘票票电影”APP         257
15.1 准备工作        257
15.1.1　开发环境           257
15.1.2　搭建Angular 脚手架        257
15.1.3　创建项目组件          261
15.2 设计项目组件        262
15.2.1　设计头部和底部导航组件      262
15.2.2　设计电影页面组件  265
15.2.3　设计影院页面组件  276
15.2.4　设计我的页面组件  279
15.3 设计主组件     281
15.3.1　电影页面组件          281
15.3.2　影院页面组件          284
15.3.3　我的页面组件          285
15.4 项目的重要文件     286
15.4.1　主页面（index.html）      286
15.4.2　根模块（app.module.ts）        287
15.4.3　路由文件（app-routing.
module.ts）        287
15.4.4　项目公共样式（style.css）     288
15.4.5　根组件（app.component）      288
第16 章 仿网易云音乐网站            290
16.1 准备工作        290
16.1.1　开发环境           290
16.1.2　创建项目           290
16.1.3　模块设计           293
16.1.4　数据来源           295
16.1.5　定义数据的类型      297
16.2 页面的头部和脚注设计          299
16.3 轮播组件        301
16.4 推荐歌单        305
16.5 歌手列表        308
16.6 底部播放器      311
16.7 滑块组件        315
16.8 ngrx 状态管理        316
16.9 实现播放器功能     319
16.10 播放列表和歌词   325
16.11 歌单列表       331
16.12 歌单详情页          333
16.13 歌曲的详情页面   339
16.14 搜索功能      343