Initially, I am attempting to retrieve all projects from the database based on the provided userId from the URL. This operation is performed in the ngOnInit() lifecycle hook. Each project contains a field named Languages, which represents a list of objects from another table called Languages. Each record in the Languages table includes a field called projectId, which I use to fetch all languages for each project. It seems like I am encountering an issue with data being retrieved asynchronously, as the projects are fetched correctly but the languages field within each Project object is null. What steps should I take to resolve this?
ngOnInit() {
this.userId = this.route.snapshot.params['id'];
this.getAllProjectsByUserId(this.userId);
this.getLanguagesByProjectId();
}
getAllProjectsByUserId(id: number) { // Receives all projects based on the provided userId
this.portfolioAppService.getAllProjectsByUserId(id).subscribe((data) => {
this.projectsList = data;
console.log(this.projectsList);
},
error => console.error(error)
);
}
getLanguagesByProjectId() { // Retrieves all languages for each project
this.projectsList.forEach(x => {
this.portfolioAppService.getLanguagesByProjectId(x.id).subscribe((data) => {
x.languages = data;
console.log(this.projectsList);
},
error => console.error(error)
);
});
}