Javascript 如何在angularJS中显示来自服务器的img

我想显示来自服务器的图像，我的功能是：

$scope.getImage = function() {

        $http({method: 'GET', url: 'http://url.com/provawp/api/user/get_avatar/?user_id=1&type=full'}).
        success(function(data, status, headers, config) {

            var img=data.avatar;
            var element = $('<div>').html(img);
            var source = element.find('img').attr("src");
            return source;
            console.log("immagine" + source);

         }).
         error(function(data, status, headers, config) {

             console.log("errore avatar");
         });
     }

  {"status":"ok","avatar":"<img src=\"http:\/\/url.com\/provawp\/wp- content\/uploads\/2015\/06\/rest5b-150x150.jpg\" width=\"150\" height=\"150\" alt=\"admin\" class=\"avatar avatar-150 wp-user-avatar wp-user-avatar-150 alignnone photo\" \/>"}

$scope.getImage=function（）{
$http（{方法：'GET'，url:'http://url.com/provawp/api/user/get_avatar/?user_id=1&type=full'}).
成功（函数（数据、状态、标题、配置）{
var img=data.avatar；
var元素=$（''）.html（img）；
var source=element.find（'img'）.attr（“src”）；
返回源；
console.log（“immagine”+源代码）；
}).
错误（函数（数据、状态、标题、配置）{
控制台日志（“错误化身”）；
});
}

我检索我的img，然后我想显示到我的html：

   <ons-list-item  class="list-item-container">
      <div class="list-item-left">
        <img ng-src="{{getImage()}}" class="avator">
      </div>
      <div class="list-item-right">
        <div class="list-item-content">
          <div class="name">{{post.author.name}}</div>
          <span class="desc">{{formatDate(post.date)  |  date:"dd/MM/yyyy"}}         </span>
        </div>
      </div>
    </ons-list-item>

{{post.author.name}
{{formattate（post.date）}日期：“dd/MM/yyyy”}

显然，页面中有一个控制器；当我运行日志时，错误如下：

$scope.getImage = function() {

        $http({method: 'GET', url: 'http://url.com/provawp/api/user/get_avatar/?user_id=1&type=full'}).
        success(function(data, status, headers, config) {

            var img=data.avatar;
            var element = $('<div>').html(img);
            var source = element.find('img').attr("src");
            return source;
            console.log("immagine" + source);

         }).
         error(function(data, status, headers, config) {

             console.log("errore avatar");
         });
     }

  {"status":"ok","avatar":"<img src=\"http:\/\/url.com\/provawp\/wp- content\/uploads\/2015\/06\/rest5b-150x150.jpg\" width=\"150\" height=\"150\" alt=\"admin\" class=\"avatar avatar-150 wp-user-avatar wp-user-avatar-150 alignnone photo\" \/>"}

未捕获错误：[$rootScope:infdig]10$digest（）已达到迭代次数。流产！ 在过去5次迭代中激发的观察者：[]

我的Json数据如下：

$scope.getImage = function() {

        $http({method: 'GET', url: 'http://url.com/provawp/api/user/get_avatar/?user_id=1&type=full'}).
        success(function(data, status, headers, config) {

            var img=data.avatar;
            var element = $('<div>').html(img);
            var source = element.find('img').attr("src");
            return source;
            console.log("immagine" + source);

         }).
         error(function(data, status, headers, config) {

             console.log("errore avatar");
         });
     }

  {"status":"ok","avatar":"<img src=\"http:\/\/url.com\/provawp\/wp- content\/uploads\/2015\/06\/rest5b-150x150.jpg\" width=\"150\" height=\"150\" alt=\"admin\" class=\"avatar avatar-150 wp-user-avatar wp-user-avatar-150 alignnone photo\" \/>"}

{“状态”：“确定”，“化身”：“”}

用

{}

插值指令调用

ngsrc

属性中的函数，并通过ajax加载图像

URL

是没有意义的。在每个

摘要

周期中，

$http

调用将获取调用并导致以下错误

未捕获错误：[$rootScope:infdig]10$digest（）已达到迭代次数。 流产！在过去5次迭代中激发的观察者：[]

为了避免这种错误，将ajax收到的值分配到某个范围变量中，并将该范围变量绑定到

ngsrc

属性中

在控制器负载上调用

getImage

方法将是一个更好的主意

标记

<img ng-src="{{myImage}}" class="avator">

---

你能建议我怎么做吗？对不起，但我需要加载不同的用户头像，我需要以前的功能不认为吗？如何解决这个问题？@Pinstack我不理解你的担忧……你能详细解释一下吗？是的，当然，我在帖子中有ng重复帖子，每个帖子我都想找回他的头像；我想调用函数getImage（post.author.id）并检索他的头像；“你明白吗？”皮诺斯塔克：我明白你的意思了。你能为同样的问题提出新的问题吗。？