As a newcomer to Angular, I am attempting to retrieve details from Firebase as a string array using the function below:
Firestore : companies > details > app > name: "WM,TT,MP"
getCompanies(): string [] {
var appl: string [] = [] ;
this.db.database.ref("companies/details/app/").on('value', function (snap) {
snap.val().name.split(",").forEach(function(x:string){
appl.push(x);
console.log(">>>first "+appl.length);
});
});
console.log("Reached here ");
console.log(">>>second "+appl.length);
return appl;
}
Upon invoking getCompanies in a component during initialization like this:
ngOnInit() {
console.log(">>>"+this.localservice.getCompanies().length);
}
While there are no errors, the output is not as expected. The string array is returning empty, with the length being blank.
Reached here
>>>second 0
>>>0
>>>first 1
>>>first 2
>>>first 3
The issue seems to be that the second step is executing before the first step, resulting in an empty string array. How can this be resolved in Angular?