angularjsアクション後にクライアントをリフレッシュしません。

Question

画像にlike/different機能があります。 like/unlikeはng-classを使用して切り替えられます。アイコンをクリックすると、サービスコールが行われ、状態が切り替わります。しかし、これはUIに反映されていません。

私HTMLは次のとおりです。

<div class="col-sm-4 col-md-4" ng-repeat="result in searchCtrl.searchResults"> 
     <img class="img-responsive" ng-src="http://site.jpg"> 
      <div class="overlay"> 
        <a ng-click="searchCtrl.likeImage(result)"> 
        <span ng-class="'{{searchCtrl.getImageClass(result)}}'"></span></a> 
    </div> 

私のjsが、私が思う

app.controller('SearchController', function(){ 
    this.getImageClass = function(result){ 
      if(result.liked) 
       return 'fa fa-heart fa-4x'; 
      else 
       return 'fa fa-heart-o fa-4x'; 
     }; 

     this.likeImage = function(result){ 
      if(result.liked == false){ 
       myService({'mediaId':result.mediaId}).execute(function(resp) { 
        if(resp && resp.hasOwnProperty('error')) { 
         }else{ 
         result.liked = true; 
         } 
        }); 
      } 
     }; 

Answer 1

JS

のように見える、あなたの問題はあなたのサービス（ 'myServiceという'）が送信していることですいくつかのhttp要求。また、HTTP応答が受信された後、angularJSはダーティチェックを開始しません。コールバックでそれを行う必要があります。

this.likeImage = function(result){ 
     if(result.liked == false){ 
      myService({'mediaId':result.mediaId}).execute(function(resp) { 
       if(resp && resp.hasOwnProperty('error')) { 
       } 
       else{ 
        result.liked = true;      
       } 
       //pay attention there 
       $scope.$apply(); 
       }); 
     } 
    }; 

https://jsfiddle.net/aL5sqs31/2/があります。 ダミーのmyServiceを作成しようとしました。 HTTP要求の代わりにタイムアウトを設定しますが、構想は同じです