angular2 总体简述
1.图(1)
2.图(2)
3.图(3)
4.图(4)
5.图(5)
6.
可以看出angular2的组件有以下两大部分组成:分别是下面的
1.@Component部分(可以称之为装饰器),装饰器方法里有一些参数。他们就是angular2八大核心之一的元数据
装饰器是typeScript提供的一种语法特性,用来修饰一个类
2.下面的class类(可以称之为组件类),显然组件的业务逻辑都是在这个类里面去编写的。如果仅仅只是所以装饰器的作用就是赋予一个类更丰富的信息(元数据定义一个类,angular2也是不知道如何去解释这个类的。而如果在这个类上加上@Component装饰器,这个装饰器会在运行的时候把他的元数据通过某一种方式注入到这个类里面。这样angular2就能识别出来这个类是个组件类。)
如图(6)
如图(7)
1,在构造函数上可以做一些组件类的初始化工作。例如变量的初始赋值等
2.接下来会触发OnChanges钩子。这是OnChanges钩子的第一次触发。主要用来接收来自父组件
3.然后到了OnInit钩子。这个才是实际意义的组件初始化阶段。angular2不推荐在组件初始化阶段处理一些跟业务逻辑相关的工作。而更好的方式是放在init阶段去处理的传入数据。为接下来的组件初始化提供数据支持
4.接下来组件会处在稳定期。这个时候OnChanges钩子会再次触发。只要从输入属性上获得的数据发生了变化,OnChanges钩子就会触发一次
5.最后,在组件被销毁之前会触发OnDestory钩子。在这一阶段会做一些清理的工作。例如事件解绑还有取消事件订阅等。还有别的钩子......
如图(8)