Two methods are being used for api calls in my code. Method one is calling out method two and needs to wait for method two's api call to finish before continuing with its own process. I attempted to achieve this using the complete function inside a subscription, but I am facing an issue where method two continues its work without waiting for the api call to finish first. Can someone please help me identify where I might be making a mistake?
getPerson() {
this.setSelectedFlag() --> After this finishes, continue with the method
this.personArray = this.form.controls.person.value;
this.personArray .forEach((id) => {
if (!this.personMap.has(id)) {
this.loading.start();
this.api.getpersonsData({
id,
}).subscribe((response) => {
this.personMap.set(id, response);
this.loading.stop();
});
}
});
this.personMap.forEach((person, id) => {
if (!this.personArray.includes(id)) {
this.personen.delete(id);
}
});
}
setSelectedFlag() {
this.personArray = this.form.controls.person.value;
this.personArray.forEach((id) => {
if (!this.setFlagForPerson.has(id)) {
this.personArraySaving.ids.push(id);
this.api.setSelectedForPerson({
body: this.personArraySaving,
}).subscribe({
next: (data) => {
console.log(data);
},
complete: () => {
return --> I expected this to signal its completion
},
});
}
});
}