image - AngularJS ng-src and ng-attr-src don't work in IMG tag -

i'm attempting load image url in data being returned mongodb. on user's profile editing page, can edit details email address, , user profile image. email address data binding well, ng-src profile image never resolves, it's blank, though user object contains correct url should binding.

html in question:

<div ng-controller="userctrl">   <img ng-src="{{currentuser.profileimage}}" src="{{currentuser.profileimage}}" class="img-responsive" alt="profile image"/>   <input name="name" type="text" placeholder="enter name" class="form-control" ng-model="currentuser.name"/> </div> 

angularjs call init data in controller:

function userctrl($scope, $routeparams, $timeout, userservice) {   $scope.init = function() {     userservice.getcurrentuser().then(function(dataresponse) {       if (dataresponse.data) {         dataresponse.data.profileimage = "images/" + dataresponse.data.profileimage;         userservice.setcurrentuser(dataresponse.data);         $scope.currentuser = dataresponse.data;       }     });   }   $timeout($scope.init()); } 

i have tried every permutation of brackets, function calls, , delayed loading method find reference (hence timeout usage there). i'm stumped on why currentuser.name resolve fine, currentuser.profileimage not. have no idea on earth i'm missing make work it's supposed to. assistance appreciate!

first of should utilize resolve method in ngroute make sure data resolved instead of using $timeout.

what think happening here since currentuser.profileimage string (which primitive in javascript), there no 2-way binding happening therefore though function resolving, ui has computed undefined. using resolve in ngroute make sure page not load until need resolved.

.when("/user", {     templateurl: "users.html",     controller: "userctrl",     resolve: {         currentuser: function(userservice){             var currentuser = null;             userservice.getcurrentuser().then(function(dataresponse) {                 if (dataresponse.data) {                     dataresponse.data.profileimage = "images/" + dataresponse.data.profileimage;                     userservice.setcurrentuser(dataresponse.data);                     currentuser = dataresponse.data;                 }             });              return currentuser;         }     } } 

now in controller can , leave view same since ngroute handle resolving:

function userctrl($scope, currentuser) {     $scope.currentuser = currentuser; }