Components是Angular2最核心的概念,其它都是它的延伸。组件是构成整个angular2的基础单元,这些组件层层嵌套,自上而下的组成一个组件树。
组件通讯机制虽然每个组件都能够独立地完成各自的功能,但是组件不可能孤立地存在。它们之间有一套完善的通讯机制,每个组件都可以定义自己的输入输出属性,这些属性成为它们的对外接口。
全生命周期支持Angular2还有一个重要的特性,就是组件都有完整的生命周期钩子。这些钩子使我们能够清晰地知道组件的状态变化。这里列举一些重要钩子
Constructor:构造函数,做一些组件类的初始化工作,如变量的初始赋值等
接下来会触发OnChanges钩子,这是OnChanges钩子的第一次触发,来接收父组件的传入的数据。为接下来组件初始化提供数据支持。
然后到了OnInit钩子,这个才是实际意义的组件初始化阶段,Angular2不推荐在构造函数中处理跟业务逻辑相关的工作,更好的方式放在OnInit中处理。
接下里组件进入稳定期,这个时期,Onchanges钩子再次触发。只要从输入属性上获得的数据发生变化,Onchanges钩子就会触发一次。
最后在组件销毁前触发OnDestroy钩子。做一些清理工作,如事件解绑,取消数据订阅等。
组件示例 元数据与装饰器@Components是一个装饰器,装饰器是Typescript提供的语法特性,用来修饰一个类。如果只定义一个类,Angular2是没法解释这个类的,如果在这个类上加上@Component装饰器,装饰器在运行的时候,会把它的元数据参数通过某种方式注入到这个类中,Angular2就能识别出原来这个类就是组件类。
装饰器就是赋予一个类更丰富的信息,这些信息就是元数据。
网友评论