Angular5 宏观把控
Angular5 宏观把控
1.首先，Angular5相对于Angular4有了一些新的特性：
（1）i18n国际化管道；
（2）一个组件可以以多个名称导出；
（3）使用httpClient；
相比于http，httpClient的功能更加完善丰富——引入不可变的请求/响应对象。通过使用拦截器将中间件逻辑添加到管道中。支持JSON主体类型，不再需要显式分析。HttpClient支持请求上传和响应下载的进度事件。
（4）5的渲染速度更快。移动设备体验更加优秀；另外，5的项目构建有所改进，编辑器也有所改进（这些等研究框架架构再详细了解）；
（5）动画功能有所丰富；
（6）表单验证功能更加完善；
表单验证中加载了一些新功能。通过使用字段或表单的有效性和值，将 updatedOn blur选项和 updatedOn submit选项添加到Formcontrols中，并且更新而不是每个输入事件。谷歌还推出了 updateOn对ngModelOptions的支持，通过延迟表单控件更新来提高其性能，直到Angular 5中的“模糊”或“提交”事件发生。
（7）路由的生命周期得以监听，以下是一些事件：GuardsCheckStart, GuardsCheckEnd, ResolveStart, ResolveEnd, ActivationStart,ActivationEnd, ChildActivationStart, and ChildActivationEnd。
2.其次，angular5本身的特性：
（1）模块——以@NgModule装饰器的一个类；此外，本身还提供了一组以@angular修饰的的js库模块；
（2）组件——一个通用类，由一些方法和属性组成的一个API，控制部分可以重用的视图；
（3）模板template——以*ngFor、*ngIf、{{hero.name}}、(click)、[hero]等angular特有的形式等和页面样式等组成的部分，一般是HTML的形式，或者HTML片段；
（4）元数据——@Component部分；
（5）数据绑定——
- 属性绑定和插值表达式 组件类-> 模板
- 事件绑定：模板 -> 组件类
- 双向绑定： 模板 <-> 组件类
<li>{{hero.name}}</li>
<app-hero-detail [hero]=“selectedHero”></app-hero-detail>
<li (click)=“selectHero(hero)”></li>
<input [(ngModel)]=“hero.name”>
（6）指令——实际上@Component就相当于1的@Directive
（7）服务——
（8）依赖注入——被依赖的服务需要injector
（9）路由