将数据传递到角度的子组件（从Web服务获取的数据未附加在子组件上）

Question

我正在尝试在服务加载后分配数据，以便更好地了解代码。

服务

getcampaigndata(slug: any): Promise<any> {                
     return this.http
                .get('service url'+slug)
                .toPromise()
                .then((res) => res.json())
                .catch(this.handleError);
}

父母组成

public slug: string;
public data: any = {};

this.campaign.getcampaigndata(this.slug).subscribe(params => {
      this.data = params;
});

子组件

import {CampaignComponent} from '../../campaign.component';

constructor(private shared: SharedService,private route:ActivatedRoute,public campaign: CampaignComponent) { };

 ngOnInit() {
     console.log(this.campaign.slug);
     console.log(this.campaign.data);
 }

**Output** :
SLUG
Object{}

如您所见，我已经CampaignComponet在另一个组件上导入了它，它对slug cuz的工作非常好，它slug是在运行时分配的，但是data由于http请求而没有分配。有人对此有解决方案吗？

使用this.data=JSON.parse(localStorage.getItem('currentCampaig??n'));instand的web服务工作正常

Answer 1

使用@Input装饰器将数据传递到子组件

<child-component [myData]="data"></child-component>

而在 ChildComponent

export class ChildComponent {
  @Input() myData;
}

而且在什么时候ngOnInit()被调用，您传递的数据尚未绑定。因此，您需要另一个生命周期事件，ngOnChanges()或者ngAfterViewInit()。