《Angular权威教程》中文版终于出版了！
图2 英文版新封面译者序: Angular 2 or Angular 4/5/6...
英文版都变成 Angular 4 了，你说我支不支持呢？
我当然支持！
在译者序里，译者们给了大家一颗定心丸——
翻译说明: 未来的版本号及发布计划
Angular就要出4.0了（在本书中文版印刷的时候实际上已经出了）！是的，过一阵子还有Angular 5/6/7/8……这本书会很快过时吗？答案是“不会”。Angular开发组对于未来的版本号及发布计划有一个正式的说明，大意是：
我们要兼顾向后兼容和向前演进，因此以后我们将严格遵循SemVer语义化版本规范，并力求让版本升级变得可预测，以便使用者可以提前安排。在大版本号之间会出现少量破坏性变更，但是不用担心，相邻的大版本号之间只会把一些API标记为废弃的。也就是说，理想情况下，4的程序是可以直接迁移到5的，只是会收到一些API废弃提示，到6中才会彻底移除。同时，官方会在文档中给出详细的升级指南，帮助开发者升级。
所以，大家大可不必因为封面上印的是“The Complete Book on Angular 2” 就心存疑虑，ng爱好者们对这本书该掏银子还是要掏的，react.js 的版本还一下就从0.14升级到15了呢。
写在前面: 如何阅读本书? How to Read This Book?
如果你不清楚如何运行特定的示例应用程序，请阅读示例代码里的README.md文件。 每个示例项目都包含一个README.md，它将告诉你每个应用程序怎么运行。
另外，示例项目中用到了一些需要爬梯子才能获得的数据，比如上油管的网站扒数据，这方面我们要注意一下。
第一章、起步
第一章用一个比较简单的例子来演示angular开发的基本过程。
首先我们要安装的是基础环境。
npm install-g angular-cli
剩下的按部就班的完成1.1、1.2的步骤，以及1.3的开头那一部分，如果不出意外，那么第一个hello world类型的程序就跑起来了。如果不愿意敲代码，可以打开ng-book-code中的 first-app/angular-hello-world，来看代码的构成。
接下来的1.3节其实是一个比较重要的一节，从这一节里我们将开始接触整个Angular 2/4... 中的最总要的概念之一 —— component（组件），Angular背后的指导思想之一就是组件化。
接下来的1.4、1.5、1.6章逐步演示了component的组织机制，数据展示、数组展示等最常用的方法，也让我们逐步感受了Angular的组件化开发方式。
1.7-1.11 逐步深入的教我们仿造了一个Reddit风格的网站，可以发帖、点赞、显示帖子列表。在这个过程中我们会接触如何设计表单、提交表单、按钮触发等基础方法。
小结：Angular程序的基本开发逻辑：
(1) 把应用拆分成组件；
(2) 创建视图；
(3) 定义模型；
(4) 显示模型；
(5) 添加交互。
第二章 TypeScript
如果没有接触过TypeScript，看到component的代码可能会有些懵，import、@xxx、这些代码风格都和传统的javascript差异比较大，不要着急，第二章就会介绍TypeScript。虽说本书口口声声说没有TS也不影响你写Angular2/4的程序，但实际情况是，你离开了TS在angular2/4的世界里几乎就会步履艰难。
TypeScript相对于ES5有五大改善：类型、类、注解（也就是@装饰符）、模块导入、语言工具包（比如，解构）。
顾名思义，TypeScript最主要特点的就是引入了类型。在实践中，你会逐渐发现TypeScript带来的一些好处：比如清晰的类型可以帮助我们预防很多编译期的bug，同时也有助于代码的阅读和团队协作。
第 3 章 Angular的工作原理
经过第一章的尝试，我们应该能感受到组件(component)在Angular中的重要地位，现在我们可以进一步的肯定：一个Angular应用其实就是一棵由组件构成的树。
🔱 甚至，组件本身也可以通过递归的方式调用自己!
使用组件的方式，可以促使我们思考如何把一个大的系统分成小系统乃至细碎的小零件，而这些小零件也许可以在不同的大组件中重复使用，从而提高系统的代码重用率，也可以有利于大型项目里的团队协作式开发。
图3 组件树图3是一个用组件化思维搭建系统的典型例子，根组件是最顶层的“库存管理系统”，系统可以有若干产品列表，一个产品列表下又可以有若干产品条目、产品条目下又分为图片、分类、价格等细节，每一个层级都可以设计成组件的形式，最后又由各级导航连接起来。
本章还介绍了组件之间的信息传递: 可以通过component的@Input和@Output来完成，@Input 是上一级组件向下一级组件传递的数据，而@Output则是下一级组件向上一级组件传递的事件。
跟着本章的学习，我们基本上可以掌握开发Angular程序的主要思路：那就是把你的系统逐级拆分成由大到小的组件，其实还有一个原则有助于思考如何拆分，那就是Dont' Repeat Yourself（DRY编程原则）。
第四章 内置指令
如果已经有Angular.JS(1.x)的基础，那么这章会很熟悉，是一脉相承的。
Angular的内置指令主要分为两大类：
（1）控制流：ngIf、ngSwitch、ngFor
（2）样式：ngStyle、ngClass
这两类指令对于前端程序员来说都很好理解，所以不再赘述。
第五章 表单
从最早期的互联网开始，表单就是互联网程序不可或缺的一部分，只要有需要用户填写信息的地方，就要用表单来实现。
Angular 的表单实现有两种方式：
（1）模版驱动的表单 （Template-Driven Forms）
（2）模型驱动的表单（Model-Driven Forms）
所谓模版驱动的表单，可以看成一种静态的表单。通常用于应用场景已经固定，要填写的数据也是固定的，比如登录页面，要填写的就是用户名（邮箱）+ 密码，这种没有多余数据的地方就适合用模版驱动的方式开发。而且很简单，把模版与要处理的数据绑定好，甚至不需要你敲什么TS代码，就能自动捕获你输入的表单信息。
图4 模版驱动的表单而模型驱动的表单，也称为动态表单（Reactive Forms）是一种动态构建表单的技术，用于解决有时候手动编写和维护表单所需工作量和时间会过大的问题。特别是在需要编写大量表单时。表单都很相似，而且随着业务和监管需求的迅速变化，表单也要随之变化，这样维护的成本过高，如果我们有了原始的JSON数据就可以动态的生成表单，那就太方便了。
比如我们有这样一个两个模型：英雄和魔法
class 英雄{
英雄名: string;
魔法列表: 魔法[];
}
class 魔法{
魔法名: string;
攻击力: number;
}
模版驱动和模型驱动表单这两种方法并无优劣区分，只有适用场景之分，我们应该在合适的地方采用合适的方法。