がなぜこのリソースは、$は次のように私は、コントローラを持っている私の角度のアプリでは、この方法

Question

を削除使用した後のビューを更新していません。次のように：私は上記のテンプレートで削除リンクをクリックしたとき

<table ng-model="templates"> 
    <thead> 
     <tr> 
      <th style="width:40%">Title</th> 
      <th style="width:40%">controls</th> 
     </tr> 
    <thead> 
    <tbody> 
     <tr ng-repeat="template in templates"> 
      <td> 
       <!-- Link to template details page --> 
       <a href="#/template/[[template.id]]"> 
        [[template.title]] 
       </a> 
      </td> 
      <td> 
       <!-- Link to template details page --> 
       <a class="btn btn-primary btn-small" 
        href="#/template/[[template.id]]">Edit 
       </a> 
       <!-- Link to delete this template --> 
       <a class="btn btn-primary btn-small" 
        ng-click="deleteTemplate(template.id)">Delete 
       </a> 
      </td> 
     </tr> 
    </tbody> 
</table> 

は今、それはdeleteTemplateメソッドを呼び出し、成功したDELETE呼び出しがREST APIに行われています。しかし、リフレッシュされ、$scope.templates = TemplateService.get();が再び開始されるまで、ビューは更新されません。私は間違って何をしていますか？

Answer 1

また、あなたは$リソースにコールバック関数を渡すことができ

ng-click="deleteTemplate($index)"> 


$scope.delete = function (idx) { 
    var templateid = $scope.templates[idx]; 

    API.Deletetemplate({ id: templateid.id }, function (success) { 
    $scope.templates.splice(idx, 1); 
    }); 
}; 

Answer 2

以下のようにソースコードを変更します。あなたの場合は$

function TemplateListControl($scope, TemplateService){ 
    $scope.templates = TemplateService.get(); // Get objects from resource 

    // Delete Method 
    $scope.deleteTemplate = function(id){ 
    TemplateService.$delete({id: id}, function(data) { 
     $scope.templates = data; 
    }); 
    } 
} 

注意 を削除し、クライアント側を更新する必要がありますREST API delete関数は、AngularJS $リソースエラーを避けるために、Angular $リソースでisArray：trueを設定する配列を返します。TypeError：Object＃には 'push'メソッドがありません

$resource(URL, {}, { 
    delete: {method:'DELETE', isArray: true} 
}); 

Answer 3

私はコールバックの代わりに約束を使用することをお勧めします。プロミスは、非同期プロセスを処理する新しい方法です。プロンプトがサーバーから戻った直後にプロミスを使用して結果を検査できます。

//Controller 
myApp.controller('MyController', 
    function MyController($scope, $log, myDataService) { 

$scope.entities = myDataService.getAll(); 
$scope.removeEntity = function (entity) {  
     var promise = myDataService.deleteEntity(entity.id); 
     promise.then(
      // success 
      function (response) { 
       $log.info(response); 
       if (response.status == true) { 
        $scope.entities.pop(entity); 
       } 
      }, 
      // fail 
      function (response) { 
       $log.info(response); 
       // other logic goes here 
      } 
     ); 
    }; 
}); 

//DataService 
myApp.factory('myDataService', function ($log, $q, $resource) { 

return { 
    getAll: function() { 
     var deferred = $q.defer(); 
     $resource('/api/EntityController').query(
      function (meetings) { 
       deferred.resolve(meetings); 
      }, 
      function (response) { 
       deferred.reject(response); 
      }); 

     return deferred.promise; 
    }, 

    deleteEntity: function (entityId) { 
     var deferred = $q.defer(); 
     $resource('/api/EntityController').delete({ id: entityId}, 
      function (response) { 
       deferred.resolve(response); 
      }, 
      function (response) { 
       deferred.reject(response); 
      }); 

     return deferred.promise; 
    } 
    }; 
}); 

//Web API Controller 
public class MeetingController : BaseApiController 
{ 
    // .... code omited 

    public OperationStatus Delete(int entityId) 
    { 
     return _repository.Delete(_repository.Single<MyEntity>(e => e.EntityID == entityId)); 
    } 
} 

注：$ log、$ q、$ resourceは、サービスに組み込まれています。期待しています:)