Angular 6 Service
getProjectEpics(id: string): Observable<any> {
return this.http.get<any>(this.baseUrl + 'getEpics/' + id);
}
Component Angular 6
projectEpics=[];
getProjectEpics(id: string) {
this.epicService.getProjectEpics(this.id).subscribe(
next => {
console.log('RESPONSE', next);
this.projectEpics = next[0].epics;
console.log(this.projectEpics); // array has data
},
error => {
this.alertify.error(error);
}
);
console.log(this.projectEpics); // The array is empty at this log.
}
In my project using Angular 6, I have set up a service method called getProjectEpics which returns an observable of any type by making an API call. In the component, I am subscribing to this observable method from the service. When I receive the data from the API and service, I assign the data stored in the 'next' object to a local array named projectEpics. When I log this array inside the subscription block, it shows the expected data. However, when I log it outside the subscription block, the projectEpics array appears empty with no data.