如何在 ng-repeat 中显示来自服务器的不同图像

Question

如何使用 angularJS 显示来自服务器的不同 img，我在帖子中有 ng-repeat 帖子，对于每个帖子我想检索他的头像；我想调用一个函数 getImage(post.author.id) 并检索他的头像

  $scope.getImage=function(a){

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

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

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

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

    };

我的html：

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

</ons-list>

我有这个错误： 未捕获的错误：[$rootScope:infdig] 达到 10 个 $digest() 迭代。中止！在最后 5 次迭代中触发的观察者

Answer 1

你可以这样做：

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

</ons-list>