# How to execute another function after async completed?

I am making angularjs and typescript based application, where in constructor i am calling load function like,

private load(): angular.IPromise<void> {

const progTokInit: string = 'initial';
this.$scope.progress.start(progTokInit); return this.entityService .load(this.$scope.projectRevisionUid)
.then(resp => {

//Doing foreach and sending employeeModel to get the financetype of the person
resp.employeeRates.forEach(employeeModel => this.getFinanceType(employeeModel));

this.refreshCostRate(...resp.employeeRates)
.then(() => // Another Function )
.then(() => // Yet Anothoer Function )
})
}


Here i am in the need to fetch the financetype of a person for which if i send the cost center number, i will get the data so i have given like this in getFinanceType() function,

  private getFinanceType (employeeModel:any) {
this.costService.getFinanceType(employeeModel.person.cost_center.getValue()[0])
.then((result) => {
console.log('res ', result);
employeeModel.financeType = result;
return result;
});
}


This above function is asychronous so there will be a maximum delay to get all the relevant data until then i need to wait to move to next step i.e, i need to call this.refreshCostRate(...resp.employeeRates) only if this current getFinanceType () function finishes its task completely..

I have tried using async/await like,

  private async getFinanceType (employeeModel:any) {
await return this.costService.getFinanceType(employeeModel.person.cost_center.getValue()[0])
.then((result) => {
console.log('res ', result);
employeeModel.financeType = result;
return result;
});
}


but nothing helps, the execution continues eventhough this data was not completed so i am unable to set the data of employeeModel.financeType at right time.

Please help me out in handling this situation of wait until this getFinanceType() finishes its job then after execute another function and yet another function..

Source: AngularJS