Angular2：在show component之前等待该服务返回响应

Question

I have an Angular2 component, and i need to populate an attribute of an interface with some data returned by a webservice. I've this code:

ngOnInit() {
    this.services.callMyService().subscribe(
       response => this.response = response,
       error => alert(error),
       () => this.initInterface()
    )
}


initInterface() {
    this.myInterface= {
       field1: '',
       field2: 'someData',
       fieldFromService: this.response.field
    };
}

but it seems that component is showed before service has do its job. In fact, if i try to access for example to field1, i obtain an error:

error_handler.js:47 EXCEPTION: Cannot read property 'field1' of undefined

what's wrong?

Answer 1

I believe this should work.

ngOnInit() {
   this.services.callMyService().subscribe(
       response => {this.response = response;
                () => this.initInterface();
               },
       error => alert(error),

)

}