I am trying to pass the result of a function from my service to a component. However the issue I am having is that the service function is executing after the page loads, therefore the variable I'm assigning is undefined at that point.
If I add a time out it works, but was looking for a better solution, as I don't think that's the correct approach.
I have been trying to use an observable but lacking knowledge to get it working, so would appreciate any help.
This is the function in the service:
load_documents() {
this.apiPost = {
"credentials":
{"user_name":localStorage.username,"password":localStorage.password,"application":settings.application,"eEncryption_type":settings.encryption_type},
"criteria":
{"date_from":"2021-06-19T07:00:00.000Z","date_to":"2022-07-20T06:59:00.000Z","publish":1}
}
this.apiService.getDocuments(this.apiPost).subscribe((apiResponse: any) => {
this.jsonobj = JSON.parse(apiResponse.d);
var documents= [];
for (var i in this.jsonobj.rows) {
documents.push({
doc_id: this.jsonobj.rows[i].cells[0].paragraphs[0].value,
icon: this.jsonobj.rows[i].cells[1].paragraphs[0].value,
title: this.jsonobj.rows[i].cells[2].paragraphs[0].value,
date: moment(this.jsonobj.rows[i].cells[3].paragraphs[0].value).format('LLL'),
publication: this.jsonobj.rows[i].cells[4].paragraphs[0].value,
stage: this.jsonobj.rows[i].cells[5].paragraphs[0].value,
author: this.jsonobj.rows[i].cells[6].paragraphs[0].value,
checked_out: this.jsonobj.rows[i].cells[7].paragraphs[0].value,
entity: this.jsonobj.rows[i].cells[8].paragraphs[0].value,
completed: this.jsonobj.rows[i].cells[9].paragraphs[0].value,
bus_area: this.jsonobj.rows[i].cells[10].paragraphs[0].value,
language: this.jsonobj.rows[i].cells[11].paragraphs[0].value,
filename: this.jsonobj.rows[i].cells[12].paragraphs[0].value,
distribution_status: this.jsonobj.rows[i].cells[13].paragraphs[0].value,
summary_text: this.jsonobj.rows[i].cells[14].paragraphs[0].value,
selected: true,
price: this.jsonobj.rows[i].cells[15].paragraphs[0].value,
clientType: this.jsonobj.rows[i].cells[19].paragraphs[0].value,
favourites: this.jsonobj.rows[i].cells[23].paragraphs[0].value,
subtitle: this.jsonobj.rows[i].cells[25].paragraphs[0].value,
docprice: this.jsonobj.rows[i].cells[27].paragraphs[0].value,
doctp: this.jsonobj.rows[i].cells[28].paragraphs[0].value,
docrec: this.jsonobj.rows[i].cells[29].paragraphs[0].value,
migrated: this.jsonobj.rows[i].cells[30].paragraphs[0].value,
analystsList: this.jsonobj.rows[i].cells[31].paragraphs[0].value,
classificationsList: this.jsonobj.rows[i].cells[32].paragraphs[0].value,
favourite_main: this.jsonobj.rows[i].cells[23].paragraphs[0].value,
}
)
if(this.jsonobj.rows[i].cells[25].paragraphs[0].value !== '' ){
this.jsonobj.rows[i].cells[25].paragraphs[0].value = '- '
}
else{
this.jsonobj.rows[i].cells[25].paragraphs[0].value = ' '
}
}
this.alertify.success('Documents loaded');
DocumentService.documents = documents ;
}, error => {
this.alertify.error(error);
});
}And this is the call in the component (works if I put a timeout):
load_documents() {
this.documentService.load_documents();
setTimeout (() => {
this.documents = DocumentService.documents;
}, 1500);
}Doesn't work if I remove the timeout:
load_documents() {
this.documentService.load_documents();
this.documents = DocumentService.documents;
}