Can anyone help me figure out why my ng-repeat isn't updating with the data from the array I'm trying to display? Here's a snippet of the HTML code:
<div ng-controller="photoCtrl as c">
<div ng-repeat="p in c.photos">
<div>USER: {{p.user_id}}</div><br/>
<div>PHOTO NAME: {{p.name}}</div><br/>
<div>PRICE: {{p.price}}</div><br/>
<hr>
</div>
<button ng-click="prev()">Prev</button><input type="number" ng-model="page_nr"><button ng-click="next()">Next</button>
</div>
Here is the Angular controller code:
app.controller('photoCtrl', ['$scope', '$window', 'PhotoFactory', function($scope, $window, PhotoFactory){
$scope.photos = [];
$scope.page_nr = 0;
$scope.searchNextFive = function(){
let toSend = angular.copy($scope.page_nr);
PhotoFactory.searchNextFive(toSend).then(function(response){
$scope.photos = angular.copy(response.data);
console.log($scope.photos);
});
};
$scope.getAll = function(){
let toSend = angular.copy($scope.user);
PhotoFactory.getAll(toSend).then(function(response){
$scope.photos = angular.copy(response.data);
console.log($scope.photos);
});
};
$scope.prev = function(){
$scope.page_nr--;
$scope.searchNextFive();
};
$scope.next = function(){
$scope.page_nr++;
$scope.searchNextFive();
};
}]);
Although there are no errors in the code and the 'photos' array does update correctly when changed (as shown by the console.log()), the data is not rendering on the page. Could it be an issue with how ng-repeat is being used on div tags or am I missing something else?