Currently, I am in the process of developing a spring web application where I have implemented a div table. My goal is to showcase data from an array within angularjs's $scope using ng-repeat. Here is an example:
<div ng-repeat="element in elements>
{{element.id}}
</div>
My next objective is to retrieve additional information about the current element stored in a separate database table. This is how it could look like:
...
{{getImage(element.id)}}
...
To fetch data from the database, I have adopted the rest approach by sending HTTP get requests and storing the retrieved data in the $scope.
The code snippet below, however, doesn't produce the desired outcome:
$scope.getImage = function(id){
$http.get("services/rest/getImage/" + id).then(function(response){
return response.data;
},
function(response){
});
}
This results in an endless loop of HTTP requests being sent, likely due to the asynchronous nature of JavaScript requests as I attempt to simultaneously retrieve an element from the database and assign it elsewhere.
How can this issue be effectively resolved?