Currently, I am tackling a situation where I must retrieve a series of objects from Spring Boot by making REST calls and then display them in the user interface using Angular 5.
This is what my component looks like:
export class BusinessComponent implements OnInit {
serviceSavings:Services[] = [];
constructor(private ServicesService:ServicesService) {
}
ngOnInit() {
this.ServicesService.getServicesByCatID(PRODUCTSAVINGSID)
.subscribe(serviceSavings => this.serviceSavings = serviceSavings);
console.log("The length of serviceSavings :", this.serviceSavings.length); //this always prints zero.
}
examplemethod() {
console.log("The length of serviceSavings :", this.serviceSavings.length);
}
}
Currently, the issue lies with the log statement inside the init() method displaying 0 rows of the service. My goal is to retrieve each service from the list and perform actions on them.
Interestingly, when I move the same log statement to a user-defined method, triggering it with a user action in the UI, it accurately displays the count of the list as stored in the database table.
During the application load, I need to embed some business logic within init() to showcase certain values in the UI. However, the length of the retrieved list is consistently 0 in init(), making it impossible to iterate through the values. I suspect there is an issue with the update of the array object.
Here is what my service method looks like:
getServicesByCatID(categoryid){
return this.http.get(this.getServiceUrlByCategory(categoryid))
.map(res => res.json());
}
The Spring Boot application flawlessly returns the list of objects without any hitches at the backend.
Would appreciate any help in pinpointing the issue. Thank you.