执行顺序
parentConstructor 父组件的构造函数
childConstructor 子组件的构造函数
parentOnInt 父组件的OnInit方法
parentDoCheck 父组件的DoCheck方法
parentContentInit 父组件的ContentInit方法
parentContentChecked 父组件的ContentChecked方法
childtestb undefined 子组件接收父组件传递的属性testb, 接收的属性之间的执行先后顺序由子组件中@Input的先后顺序决定,写在前面的属性先接收到
childtesta testb 子组件接收父组件传递的属性testa
childOnChange 子组件的OnChange方法
childOnInt 子组件的OnInit方法
childDoCheck 子组件的DoCheck方法
childContentInit 子组件的ContentInit方法
childContentChecked 子组件的ContentChecked方法
childViewInit 子组件的ViewInit方法
childViewChecked 子组件的ViewChecked方法
parentViewInit 父组件的ViewInit方法
parentViewChecked 父组件的ViewChecked方法
parentDoCheck 父组件的DoCheck方法
parentContentChecked 父组件的ContentChecked方法
childDoCheck 子组件的DoCheck方法
childContentChecked 子组件的ContentChecked方法
childViewChecked 子组件的ViewChecked方法
parentViewChecked 父组件的ViewChecked方法
子组件的内容:
import { Component, OnInit, Input } from '@angular/core';
@Component({
selector: 'app-title',
templateUrl: './title.component.html',
styleUrls: ['./title.component.less']
})
export class TitleComponent implements *OnInit* {
_testa: *any*;
_testb: *any*;
@Input()
set testb(*testb*: *any*) {
*this*._testb = testb;
*console*.log('childtestb', *this*.testa);
}
get testb() {
return *this*._testb;
}
@Input()
set testa(*testa*: *any*) {
*this*._testa = testa;
*console*.log('childtesta', *this*.testb);
}
get testa() {
return *this*._testa;
}
constructor() {
*console*.log('childConstructor');
}
ngOnChanges() {
*console*.log('childOnChange');
}
ngOnInit(): *void* {
*console*.log('childOnInt');
}
ngDoCheck() {
*console*.log('childDoCheck');
}
ngAfterContentInit(): *void* {
*console*.log('childContentInit');
}
ngAfterContentChecked(): *void* {
*console*.log('childContentChecked');
}
ngAfterViewInit(): *void* {
*console*.log('childViewInit');
}
ngAfterViewChecked(): *void* {
*console*.log('childViewChecked');
}
}