Angular企业级应用开发实战PDF|Epub|txt|kindle电子书版本网盘下载

Angular企业级应用开发实战PDF格式电子书版下载

注意：本站所有压缩包均有解压码： 点击下载压缩包解压工具

第1篇 准备2

第1章 Angular概述2

1.1 Angular产生的背景2

1.1.1 Angular与jQuery的不同2

1.1.2 Angular与React、 Vue.js优势对比3

1.1.3 Angular、 React、 Vue.js三者怎么选5

1.2 学习Angular需要什么基础5

1.2.1 具备面向对象思维5

1.2.2 熟悉常用的前端开发工具5

1.2.3 具有一定的前端开发经验6

1.3 如何使用本书6

1.3.1 零基础的读者6

1.3.2 有后端开发经验的读者7

1.3.3 有前端开发经验的读者7

1.3.4 有Angular开发经验的读者7

第2章 实例1：快速创建第一个Angular应用8

2.1 开发环境准备8

2.1.1 安装Node js和npm8

2.1.2 设置npm镜像9

2.1.3 选择合适的IDE10

2.1.4 安装Angular CLI10

2.2 创建第一个应用——hello－world11

2.2.1 使用Angular CLI初始化应用11

2.2.2 运行Angular应用12

2.3 探索Angular13

2.3.1 src文件夹13

2.3.2 根目录14

2.3.3 npm包16

2.4 配置TypeScript库18

第2篇 入门21

第3章 TypeScript基础21

3.1 了解TypeScript21

3.1.1 TypeScript与JavaScript、 ECMAScript的关系21

3.1.2 TypeScript与Angular的关系22

3.1.3 使用TypeScript的优势22

3.1.4 TypeScript代码的编译及运行22

3.2 变量与常量23

3.2.1 var、 let、 const三者的作用域23

3.2.2 变量与常量的区别23

3.2.3 什么是变量提升24

3.3 TypeScript的数据类型25

3.3.1 基本类型25

3.3.2 对象类型30

3.3.3 任意类型30

3.3.4 实例2：演示任意类型的使用31

3.3.5 联合类型32

3.3.6 交集类型32

3.4 强大的面向对象体系33

3.4.1 类33

3.4.2 接口37

3.4.3 实例3：演示接口的使用37

3.4.4 泛型38

3.4.5 实例4：演示泛型的使用38

3.4.6 枚举39

3.5 TypeScript的命名空间40

3.5.1 声明命名空间40

3.5.2 实例5：声明命名空间41

3.5.3 命名空间体41

3.5.4 导入别名声明42

3.5.5 实例6：导入别名声明42

3.5.6 导出声明43

3.5.7 合并声明43

3.5.8 实例7：合并声明43

3.6 TypeScript的模块44

3.6.1 了解模块44

3.6.2 实例8：导入声明45

3.6.3 实例9：导入Require声明45

3.6.4 实例10：导出声明46

3.6.5 实例11：导出分配46

3.6.6 了解CommonJS模块46

3.6.7 了解AMD模式47

3.7 装饰器48

3.7.1 定义装饰器49

3.7.2 了解装饰器的执行时机49

3.7.3 认识4类装饰器51

第4章 实例12：创建一个“用户管理”应用55

4.1 创建应用55

4.1.1 新建“用户管理”应用56

4.1.2 了解Angular组件56

4.2 修改AppComponent组件56

4.2.1 修改app.component.ts文件57

4.2.2 修改app.component.html文件57

4.2.3 添加应用级别的样式57

4.3 实现用户编辑器58

4.3.1 创建用户列表组件58

4.3.2 添加user属性60

4.3.3 显示用户60

4.3.4 显示UsersComponent视图60

4.3.5 创建User类61

4.3.6 编辑用户信息62

4.3.7 添加FormsModule模块63

4.3.8 声明组件65

4.4 展示用户列表65

4.4.1 添加用户列表数据65

4.4.2 显示用户列表66

4.4.3 用＊ngFor列出用户66

4.4.4 添加样式67

4.4.5 添加事件68

4.4.6 设置选中的样式70

4.5 多组件化开发71

4.5.1 创建UserDetailComponent组件72

4.5.2 编辑user－detail.component.html文件72

4.5.3 编辑user－detail.component.ts文件73

4.5.4 编辑users.component.html文件73

4.6 使用服务74

4.6.1 服务的好处74

4.6.2 创建UserService服务75

4.6.3 提供UserService服务76

4.6.4 修改UsersComponent组件77

4.6.5 使用Observable数据78

4.6.6 显示消息79

4.7 使用路由83

4.7.1 路由的用处83

4.7.2 创建AppRoutingModule84

4.7.3 添加路由出口86

4.7.4 添加路由链接87

4.7.5 添加仪表盘视图89

4.7.6 导航用户详情93

4.7.7 支持路由的UserDetailComponent组件97

4.8 使用HTTP100

4.8.1 启用HTTP服务101

4.8.2 模拟数据服务器102

4.8.3 通过HTTP获取用户数据105

4.8.4 修改、添加、删除、搜索用户108

4.9 “用户管理”应用技术点总结119

4.9.1 Angular架构概览119

4.9.2 模块120

4.9.3 组件121

4.9.4 模板、指令和数据绑定121

4.9.5 服务与依赖注入121

4.9.6 路由122

第3篇 进阶124

第5章 组件124

5.1 数据展示124

5.1.1 实例13：数据展示的例子124

5.1.2 使用插值表达式显示组件属性126

5.1.3 组件关联模板的两种方式126

5.1.4 在模板中使用指令127

5.2 生命周期127

5.2.1 生命周期钩子127

5.2.2 实例14：生命周期钩子的例子127

5.2.3 生命周期钩子的调用顺序129

5.2.4 了解OnInit钩子130

5.2.5 了解OnDestroy钩子131

5.2.6 了解OnChanges钩子132

5.2.7 了解DoCheck钩子132

5.2.8 了解AfterView钩子133

5.2.9 了解AfterContent钩子133

5.3 组件交互方式133

5.3.1 实例15：通过＠Input把数据从父组件传到子组件133

5.3.2 实例16：通过setter监听输入属性值的变化135

5.3.3 实例17：通过ngOnChanges（）方法监听输入属性值的变化136

5.3.4 实例18：父组件监听子组件的事件138

5.3.5 实例19：父组件与子组件通过本地变量交互140

5.3.6 实例20：父组件调用＠ViewChild（）方法获取子组件的值141

5.3.7 实例21：父组件和子组件通过服务来通信143

5.4 样式146

5.4.1 实例22：使用组件样式的例子146

5.4.2 样式的作用域147

5.4.3 特殊的样式选择器148

5.4.4 把样式加载进组件中的几种方式149

5.4.5 控制视图的封装模式150

5.4.6 了解Emulated封装模式151

5.5 动态加载组件152

5.5.1 实例23：动态加载组件的例子152

5.5.2 使用指令157

5.5.3 加载及解析组件158

5.5.4 运行效果159

5.6 自定义元素160

5.6.1 使用自定义元素160

5.6.2 自定义元素的工作原理162

5.6.3 把组件转换成自定义元素162

5.6.4 实例24：使用自定义元素的例子163

第6章 模板168

6.1 模板概述168

6.1.1 模板的语法168

6.1.2 模板中的HTML168

6.2 模板表达式169

6.2.1 模板表达式上下文169

6.2.2 编写模板表达式的最佳实践170

6.2.3 管道操作符170

6.2.4 安全导航操作符和空属性路径171

6.2.5 非空断言操作符171

6.3 模板语句171

6.3.1 模板语句上下文172

6.3.2 编写模板语句的最佳实践172

6.4 数据绑定173

6.4.1 从数据源到视图173

6.4.2 从视图到数据源173

6.4.3 双向绑定173

6.5 属性绑定174

6.5.1 单向输入174

6.5.2 绑定目标174

6.5.3 一次性字符串初始化174

6.5.4 选择“插值表达式”还是“属性绑定”174

6.6 attribute、 class和style绑定175

6.6.1 attribute绑定175

6.6.2 class绑定175

6.6.3 style绑定176

6.7 事件绑定176

6.7.1 目标事件176

6.7.2 $event和事件处理语句177

6.7.3 使用EventEmitter类自定义事件177

6.8 模板引用变量178

6.9 输入和输出属性179

第7章 指令180

7.1 指令类型180

7.2 属性型指令180

7.2.1 了解NgClass、 NgStyle、 NgModel指令180

7.2.2 实例25：创建并使用属性型指令181

7.2.3 实例26：响应用户引发的事件183

7.2.4 实例27：使用＠Input数据绑定向指令传递值184

7.2.5 实例28：绑定多个属性186

7.3 结构型指令187

7.3.1 了解NgIf指令187

7.3.2 了解NgSwitch指令187

7.3.3 了解NgFor指令188

7.3.4 了解＜ng－template>标签189

7.3.5 了解＜ng－container>标签189

7.3.6 实例29：自定义结构型指令190

第8章 管道193

8.1 使用管道193

8.1.1 实例30：使用DatePipe管道193

8.1.2 实例31：使用UpperCasePipe管道194

8.1.3 实例32：使用LowerCasePipe管道194

8.1.4 实例33：使用CurrencyPipe管道194

8.1.5 实例34：使用PercentPipe管道195

8.2 对管道进行参数化195

8.3 链式管道196

8.4 自定义管道196

第9章 动画198

9.1 实例 35：一个动画的例子198

9.1.1 初始化应用198

9.1.2 准备工作199

9.1.3 创建组件199

9.1.4 运行效果200

9.2 状态与转场200

9.2.1 ＊状态201

9.2.2 void状态202

9.3 进场与离场202

9.4 Animatable属性与单位203

9.5 自动属性值计算204

9.6 动画时间线205

9.6.1 持续时间205

9.6.2 延迟205

9.6.3 缓动函数205

9.6.4 实例36：动画时间线的例子205

9.7 基于关键帧的多阶段动画207

9.7.1 什么是关键帧和偏移量207

9.7.2 实例37：基于关键帧的多阶段动画207

9.8 并行动画组209

9.9 动画回调210

第10章 表单212

10.1 模板驱动212

10.1.1 实例38：创建表单213

10.1.2 实例39：绑定数据217

10.1.3 实例40：提交表单219

10.2 用户输入222

10.2.1 实例41：绑定用户输入223

10.2.2 实例42：通过$event对象取得用户输入224

10.2.3 实例43：从一个模板引用变量中获得用户输入225

10.2.4 实例44： Enter键事件225

10.2.5 实例45：失去焦点事件226

10.3 表单验证227

10.3.1 模板驱动验证227

10.3.2 响应式表单验证228

10.3.3 自定义验证器231

10.3.4 自定义样式233

10.3.5 跨字段交叉验证234

10.4 响应式表单236

10.4.1 实例46：响应式表单的例子236

10.4.2 管理控件的值239

10.4.3 实例47：表单控件分组的例子240

10.4.4 实例48：嵌套的表单组的例子243

10.4.5 使用patchValue（）方法更新部分模型246

10.4.6 使用FormBuilder246

10.4.7 使用FormBuilder时的表单验证248

10.4.8 实例49：使用FormArray管理动态控件的例子249

10.5 动态表单251

10.5.1 动态表单的优势251

10.5.2 实例50：动态表单的例子252

第4篇 高阶260

第11章 使用Observable与RxJS实现响应式编程260

11.1 了解Observable机制260

11.1.1 了解基本概念260

11.1.2 定义观察者261

11.1.3 执行订阅262

11.1.4 创建Observable对象263

11.1.5 实现多播264

11.1.6 处理错误267

11.2 了解RxJS技术268

11.2.1 创建Observable对象的函数268

11.2.2 了解操作符269

11.2.3 处理错误271

11.3 了解Angular中的Observable272

11.3.1 EventEmitter273

11.3.2 HTTP273

11.3.3 AsyncPipe274

11.3.4 Router274

11.3.5 响应式表单275

11.4 对比Observable对象和Promise276

11.4.1 创建与订阅276

11.4.2 串联277

11.4.3 可取消277

11.4.4 错误处理277

11.4.5 总结对比结果277

11.5 对比Observable对象和事件API278

11.6 对比Observable对象和数组279

第12章 Angular模块281

12.1 模块概述281

12.1.1 什么是模块化281

12.1.2 认识基本模块282

12.1.3 认识特性模块283

12.2 引导启动283

12.2.1 了解declarations数组284

12.2.2 了解imports数组285

12.2.3 了解providers数组285

12.2.4 了解bootstrap数组285

12.3 常用模块285

12.3.1 常用模块概述285

12.3.2 BrowserModule和CommonModule286

12.4 特性模块分类286

12.4.1 领域特性模块286

12.4.2 带路由的特性模块287

12.4.3 路由模块287

12.4.4 服务特性模块288

12.4.5 可视部件特性模块288

12.5 入口组件288

12.5.1 引导用的入口组件288

12.5.2 路由用的入口组件289

12.5.3 entryComponents数组289

12.5.4 entryComponents数组和编译器290

12.6 服务提供商290

12.6.1 创建和提供服务290

12.6.2 服务提供商的作用域291

12.6.3 providedIn与NgModule291

12.6.4 使用惰性加载模块限制服务提供商的作用域291

12.6.5 使用组件限定服务提供商的作用域292

12.6.6 选择模块中的服务还是组件中的服务292

12.7 单例服务293

12.7.1 提供单例服务293

12.7.2 了解forRoot（）293

12.7.3 如何防止重复导入CoreModule294

12.8 共享模块295

12.8.1 实例51：共享模块的例子295

12.8.2 使用来自其他模块的组件和服务296

12.9 惰性加载的特性模块296

12.9.1 实例52：惰性加载特性模块296

12.9.2 了解forRoot（）与forChild（）300

第13章 依赖注入301

13.1 初识依赖注入301

13.2 实例53：在Angular中实现依赖注入302

13.2.1 初始应用303

13.2.2 创建服务305

13.2.3 理解注入器305

13.2.4 理解服务提供商308

13.2.5 注入服务312

13.2.6 单例服务313

13.2.7 组件的子注入器313

13.2.8 测试组件314

13.2.9 服务依赖服务314

13.2.10 依赖注入令牌315

13.2.11 可选依赖315

13.3 多级依赖注入器315

13.3.1 注入器树316

13.3.2 注入器冒泡316

13.3.3 在不同层级再次提供同一个服务316

13.3.4 组件注入器316

第14章 通过HTTP访问网络资源318

14.1 初识HttpClient318

14.2 认识空气质量数据资源318

14.3 实例54：使用HttpClient320

14.3.1 导入HttpClient320

14.3.2 编写空气质量组件321

14.3.3 编写空气质量服务321

14.3.4 注入服务到组件中322

14.3.5 返回带类型检查的响应324

14.3.6 读取完整的响应体325

14.4 实例55：错误处理327

14.4.1 获取错误详情327

14.4.2 重试328

14.5 实例56：请求非JSON格式的数据329

14.6 实例57：发送数据到服务器330

14.6.1 添加请求头330

14.6.2 发起POST请求330

14.6.3 发起DELETE请求331

14.6.4 发起PUT请求331

14.7 高级用法331

14.7.1 实例58：配置请求331

14.7.2 实例59：请求去抖332

14.7.3 实例60：拦截请求和响应333

14.7.4 实例61：监听进度334

14.8 XSRF防护335

14.8.1 了解XSRF防护335

14.8.2 实例62：实现XSRF防护335

14.9 实例63：测试HTTP请求336

14.9.1 采用Mock方式336

14.9.2 设置环境336

14.9.3 期望并回复请求337

14.9.4 测试对错误的预期337

第15章 路由与导航339

15.1 路由器的作用339

15.2 基础知识339

15.2.1 设置<base>标签关联应用目录339

15.2.2 从路由库中导入路由器340

15.3 实例64：配置路由器340

15.3.1 配置路由器340

15.3.2 输出导航生命周期中的事件342

15.4 实例65：设置路由出口342

15.5 理解路由器链接343

15.5.1 路由器状态343

15.5.2 激活的路由343

15.6 路由事件344

15.7 重定向URL345

15.8 实例66：一个路由器的例子346

15.8.1 创建应用及组件346

15.8.2 修改组件的模板346

15.8.3 导入并设置路由器346

15.8.4 添加路由出口347

15.8.5 美化界面348

15.8.6 定义通配符路由350

第16章 测试352

16.1 测试准备352

16.2 认识测试工具353

16.2.1 认识Jasmine和Karma354

16.2.2 配置Jasmine和Karma355

16.2.3 启用代码覆盖率报告355

16.2.4 了解测试工具API356

16.3 理解组件测试357

16.3.1 实例67：单独测试组件类357

16.3.2 测试组件DOM360

16.4 实例68：测试服务361

16.4.1 测试普通服务362

16.4.2 测试带有依赖的服务362

16.4.3 测试HTTP服务363

16.5 实例69：测试属性型指令364

16.6 实例70：测试管道366

16.7 调试测试程序367

第17章 实现国际化369

17.1 国际化概述369

17.2 实例71：通过i 18n工具来实现国际化369

17.2.1 使用i 18n属性370

17.2.2 在i18n属性中添加描述370

17.2.3 在i 18n属性中添加意图370

17.2.4 创建翻译源文件371

17.2.5 了解翻译源文件372

17.2.6 创建翻译文件372

17.2.7 增加应用配置373

17.2.8 运行应用374

17.3 实例72：通过ngx－translate插件实现国际化375

17.3.1 添加ngx－translate库375

17.3.2 导入并配置ngx－translate模块375

17.3.3 注入TranslateService服务376

17.3.4 编写翻译文件377

17.3.5 使用ngx－translate378

17.3.6 运行应用379

第18章 编译与部署Angular应用程序380

18.1 编译Angular应用程序380

18.1.1 编译概述380

18.1.2 编译分类380

18.1.3 为什么需要AOT编译381

18.2 了解Angular模板编译器选项381

18.3 理解Angular元数据与AOT385

18.3.1 理解元数据的限制385

18.3.2 理解AOT的工作原理385

18.4 部署Angular应用程序386

18.4.1 最简化的部署方式386

18.4.2 为生产环境准备的部署方式387

第19章 页面静态化389

19.1 Universal概述389

19.1.1 了解Universal389

19.1.2 使用Universal的好处389

19.2 初始化Universal示例390

19.3 实例73：使用Universal390

19.3.1 安装工具390

19.3.2 修改根模块 AppModule391

19.3.3 创建AppServerModule模块391

19.3.4 创建main文件392

19.3.5 创建AppServerModule配置文件392

19.3.6 创建新的构建目标并打包393

19.3.7 设置服务器环境393

19.3.8 打包并运行应用395

第20章 启用缓存397

20.1 了解Service Worker397

20.2 实例74：使用Service Worker398

20.2.1 添加service－worker包398

20.2.2 用http－server启动服务器399

20.2.3 模拟网络故障400

20.2.4 查看缓存内容400

20.2.5 修改应用402

20.2.6 在浏览器中更新应用402

20.3 了解Service Worker的通信机制403

20.3.1 有可用更新和己激活更新404

20.3.2 检查更新404

20.3.3 强制激活更新405

20.4 配置Service Worker405

第5篇 商业实战409

第21章 新闻头条客户端总体设计409

21.1 应用概述409

21.2 需求分析409

21.2.1 首页需求分析409

21.2.2 新闻详情页面需求分析410

21.3 架构设计411

21.3.1 获取访问API的密钥411

21.3.2 了解新闻API412

21.4 实例75：初始化新闻头条客户端应用414

21.4.1 修改app.component.html414

21.4.2 修改app.component.ts414

21.4.3 启动应用415

第22章 实现新闻头条客户端首页416

22.1 首页需求分析416

22.2 首页架构设计416

22.3 实例76：实现新闻头条客户端首页416

22.3.1 添加Angular Material417

22.3.2 配置动画417

22.3.3 导入组件模块417

22.3.4 包含一个主题417

22.3.5 创建组件418

22.3.6 实现界面原型418

22.3.7 查看完整的首页原型效果422

第23章 实现新闻头条客户端导航栏424

23.1 导航栏概述424

23.2 导航栏需求分析424

23.3 导航栏架构设计424

23.4 实例77：实现新闻头条客户端新闻分类425

23.4.1 新建新闻分类服务425

23.4.2 解析新闻分类数据425

23.4.3 展示新闻分类426

23.5 实例78：实现新闻头条客户端新闻列表427

23.5.1 新建新闻列表服务427

23.5.2 解析新闻列表数据428

23.5.3 展示新闻列表430

23.6 实例79：实现新闻分类与新闻列表组件通信433

23.6.1 监听导航栏单击事件433

23.6.2 自定义导航切换事件433

23.6.3 监听导航切换事件434

23.6.4 运行应用435

第24章 实现新闻头条客户端新闻详情页面436

24.1 新闻详情页面概述436

24.2 新闻详情页面需求分析436

24.3 新闻详情页面架构设计437

24.4 实例80：实现新闻头条客户端新闻详情页面437

24.4.1 新建新闻详情组件及服务437

24.4.2 获取新闻详情数据437

24.4.3 展示新闻详情438

24.4.4 创建首页组件439

24.4.5 创建路由器439

24.4.6 修改新闻列表组件440

24.4.7 接收路由参数441

24.4.8 增加“返回”按钮442

24.4.9 运行应用442

参考文献444