angular 2 child 组件未获取输入数据
angular 2 child component not getting input data
在我的例子中,我试图发出一个事件,其中包含从 parent 的一个 child 到同一 parent 的另一个 child 的数据。基本上是兄弟姐妹之间。
代码看起来像
Child一个
@Output() makeIsrCall = new EventEmitter<LeadModel>()
startCall(){
this.makeIsrCall.emit(this.lead)
}
Parent
.html
<app-isr-call-toolbar *ngIf="core.isrCallInProgress == true" [data]="isrContact"></app-isr-call-toolbar>
<app-edit-opty-workarea [objId]="tb.id" [objType]="tb.objectType" (makeIsrCall)="makeCall($event)"></app-edit-opty-workarea>
.ts
isrContact:any
makeCall(lead:LeadModel){
this.isrContact = lead
}
Child B.ts
@Input() data:any
constructor(private core:CoreStructureService) {
console.log('called construct for isr component')
alert(this.data) //this comes undefined
}
构造函数在数据到达之前就已经完成了
要么使用ngOnChanges
生命周期回调
@Input() data:any
constructor(private core:CoreStructureService) {
console.log('called construct for isr component')
}
ngOnChanges() {
alert(this.data) //this comes undefined
}
或使data
成为setter
@Input() set data(value:any) {
this._data = value;
alert(this._data) //this comes undefined
}
constructor(private core:CoreStructureService) {
console.log('called construct for isr component')
}
您的代码看起来不错,但尝试获取值的不是构造函数而是 ngOnInit 或 ngOnChanges。
例如
ngOnChanges(changes:SimpleChanges) {
console.log( changes );
}
这有效!!
在我的例子中,我试图发出一个事件,其中包含从 parent 的一个 child 到同一 parent 的另一个 child 的数据。基本上是兄弟姐妹之间。
代码看起来像
Child一个
@Output() makeIsrCall = new EventEmitter<LeadModel>()
startCall(){
this.makeIsrCall.emit(this.lead)
}
Parent .html
<app-isr-call-toolbar *ngIf="core.isrCallInProgress == true" [data]="isrContact"></app-isr-call-toolbar>
<app-edit-opty-workarea [objId]="tb.id" [objType]="tb.objectType" (makeIsrCall)="makeCall($event)"></app-edit-opty-workarea>
.ts
isrContact:any
makeCall(lead:LeadModel){
this.isrContact = lead
}
Child B.ts
@Input() data:any
constructor(private core:CoreStructureService) {
console.log('called construct for isr component')
alert(this.data) //this comes undefined
}
构造函数在数据到达之前就已经完成了
要么使用ngOnChanges
生命周期回调
@Input() data:any
constructor(private core:CoreStructureService) {
console.log('called construct for isr component')
}
ngOnChanges() {
alert(this.data) //this comes undefined
}
或使data
成为setter
@Input() set data(value:any) {
this._data = value;
alert(this._data) //this comes undefined
}
constructor(private core:CoreStructureService) {
console.log('called construct for isr component')
}
您的代码看起来不错,但尝试获取值的不是构造函数而是 ngOnInit 或 ngOnChanges。
例如
ngOnChanges(changes:SimpleChanges) {
console.log( changes );
}
这有效!!