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 );
}

这有效!!