Javascript 如何使用AngularJS显示动态加载的图像

我试图在用户登录后显示用户的化身：

<img src="{{(API_PROVIDER.domain + user.avatar.small_thumb.url)}}" alt="" class="img-circle size-30x30">

以下是为简洁起见减少的我的课程内容：

...
this.create = function(user) {
    this.user = user;
    this.role = user._role;
    this.token = user.auth_token;
    this.userRole = user._role;
};
return this;
...

以及如何保存会话以供以后检索：

...
$window.sessionStorage["userInfo"] = JSON.stringify(loginData);
...

在这种情况下我需要使用$apply吗？若有，原因为何

编辑3：下面是我如何设置会话对象

强制重新加载图像

应用时间戳并调用$scope.$appy

使用回退

HTML:

---

尝试使用ng src而不是src除了上面的注释之外，您的数据看起来不在范围内。如果不是，则在数据更新后，您必须运行$apply函数，以便模板知道您的数据已更改。您可以演示如何设置会话存储-您还可以演示如何恢复此信息吗？您可能需要在那里申请$apply。另外，您的标签是在ng中继器中还是类似的地方？可能该部分无法解决范围更改。顺便说一句，你应该总是使用ngsrc而不是src。哦，试着在图片url中省去这个！在javascript中执行a+b计算结果为常量字符串，因此angular在登录之前在{{}中有一个常量。因此，即使您更改了变量，初始常量也已解析，不会重新计算。那么可以直接在会话的其他地方计算url吗？或者在标记的角度表达式中省略圆括号。不能肯定，但似乎是这样。

...
$window.sessionStorage["userInfo"] = JSON.stringify(loginData);
...

authService.login = function(user, success, error, $state) {
  $http.post(API_PROVIDER.full_path + 'signin', user).success(function(data) {

  if(data.success){
    var user = data.user;
    var loginData = user;
    $window.sessionStorage["userInfo"] = JSON.stringify(loginData);
    delete loginData.password;
    Session.create(loginData);
    $rootScope.$broadcast(AUTH_EVENTS.loginSuccess);
    success(loginData);
  } else {
    $rootScope.$broadcast(AUTH_EVENTS.loginFailed);
    error();
  } 
  });
};

<img fallback-src="http://google.com/favicon.ico" ng-src="{{image}}"/>

JS:

myApp.directive('fallbackSrc', function () {
  var fallbackSrc = {
    link: function postLink(scope, iElement, iAttrs) {
      iElement.bind('error', function() {
        angular.element(this).attr("src", iAttrs.fallbackSrc);
      });
    }
   }
   return fallbackSrc;
});