angular2.0指令 (directive) 和组件 (component) 的生命周期解析
来源:互联网 发布:截图软件百度云 编辑:程序博客网 时间:2024/05/29 15:31
指令 (directive) 和组件 (component) 具有生命周期,由 Angular 在创建、更新和销毁它们的过程中进行管理。
你可以通过实现一个或多个生命周期钩子接口,切入到生命周期中的关键时间点。
每个接口只有一个钩子方法,方法名是接口名加前缀 ng
。例如,OnInit
接口的钩子方法名为 ngOnInit
。
当Angular使用构造函数新建一个组件或指令后,就会按下面的顺序在特定时刻调用这些生命周期钩子方法:
钩子
目的和时机
当Angular(重新)设置数据绑定输入属性时响应。 该方法接受当前和上一属性值的SimpleChanges
对象
当被绑定的输入属性的值发生变化时调用,首次调用一定会发生在ngOnInit
之前。
在Angular第一次显示数据绑定和设置指令/组件的输入属性之后,初始化指令/组件。
在第一轮ngOnChanges
完成之后调用,只调用一次。
检测,并在发生Angular无法或不愿意自己检测的变化时作出反应。
在每个Angular变更检测周期中调用,ngOnChanges
和ngOnInit
之后。
当把内容投影进组件之后调用。
第一次NgDoCheck
之后调用,只调用一次。
只适用于组件。
ngAfterContentChecked每次完成被投影组件内容的变更检测之后调用。
ngAfterContentInit
和每次NgDoCheck
之后调用
只适合组件。
ngAfterViewInit初始化完组件视图及其子视图之后调用。
第一次ngAfterContentChecked
之后调用,只调用一次。
只适合组件。
ngAfterViewChecked每次做完组件视图和子视图的变更检测之后调用。
ngAfterViewInit
和每次ngAfterContentChecked
之后调用。
只适合组件。
ngOnDestroy当Angular每次销毁指令/组件之前调用并清扫。 在这儿反订阅可观察对象和分离事件处理器,以防内存泄漏。
在Angular销毁指令/组件之前调用。
export class PeekABoo implements OnInit { constructor(private logger: LoggerService) { } // implement OnInit's `ngOnInit` method ngOnInit() { this.logIt(`OnInit`); } logIt(msg: string) { this.logger.log(`#${nextId++} ${msg}`); }}
- angular2.0指令 (directive) 和组件 (component) 的生命周期解析
- Vue2 自定义全局指令Vue.directive和指令的生命周期
- Angular2-自定义指令@Directive
- angular2 组件的生命周期钩子
- angular2 组件的生命周期钩子
- Angular2核心组件@Component
- Angular2核心组件@Component
- Angular2核心组件@Component
- React Component组件的详细说明和生命周期
- Angular2组件与指令的小实践
- Angular2--组件生命周期
- Angular2 series – Component, Directive, Pipe and Service
- angular2的ngfor和ngif指令嵌套
- angular2采用自定义指令(Directive)方式加载jquery插件
- React中文教程 - Component Lifecycle(组件的生命周期)
- angular2.0定义指令
- 自定义指令directive的作用域和绑定策略
- angular指令的简单案例和解释directive
- ios和h5交互
- bindService报空指针错误故障排除
- AccessibilityNodeInfo自动输入
- 怎么样种植4棵树木,使其中任意两棵树的距离相等?
- 第一天---看代码
- angular2.0指令 (directive) 和组件 (component) 的生命周期解析
- sphinx –rotate机制详解
- 欢迎使用CSDN-markdown编辑器
- 反射学习
- SQLServer 日期函数大全
- jquery控制超出2行写省略号
- Gulp开发教程(翻译)
- LeetCode 412. Fizz Buzz
- subline 快捷键的添加