A snippet inside my controller looks like this:
$scope.onFileSelect = function($files) {
for(var i = 0; i < $files.length; i++) {
var file = $files[i];
$scope.upload = $upload.upload({
url: '/smart2/api/files/profile',
file: file
}).success(function(data) {
$scope.photo = data;
});
}
}
Upon loading the page, users can click a modal to upload a profile photo. The modal displays their current profile photo alongside an upload input field.
I have added ng-src
to the image tag and everything is functioning properly. However, after a user uploads a new profile photo, setting $scope.photo
in the success
function of the upload call does not update the displayed photo.
I understand that I need to notify Angular about the change but I am unsure how to do so. The data returned from the HTTP call will always be the same as the data already in ng-src
or $scope.photo
, albeit with changes.
The profile photo's name corresponds to the user's name, meaning that even if they upload a new photo, the filename or source remains constant while the actual file content differs.
The issue lies in the fact that the photo does not update when I assign $scope.photo
in the success function. What could be causing this problem?