Wait till API call returns data in Angular

I have a Donut chart that is loaded with data that is returned from three API calls. I have called the chart load, and API calls function in ngOninit(). But my chart does not load. I understand that in Angular, execution does not wait for API call to return data and that it continues to execute the rest of the program. Is there some way to wait till the API call returns the data and then load the chart?

TS

ngOnit(){
this.refreshDoneCount_DE();
this.refreshNotDoneCount_DE();
this.refreshPendingCount_DE();
this.refreshChart();

}

refreshDoneCount_DE(){
this.dashboard.get_done_count_de_api().subscribe(data=>{
this.done_count_de=data;
});
}

refreshNotDoneCount_DE(){
this.dashboard.get_notdone_count_de_api().subscribe(data=>{
this.not_done_count_de=data;
});
}

refreshPendingCount_DE(){
this.dashboard.get_pending_count_de_api().subscribe(data=>{
this.pending_count_de=data;
});
}


Thank you

Continue reading...