解决资源依赖的另一个资源

Question

我有一个资源的数据依赖于另一个资源。 Transaction绑定到一个SplitTransaction其中有一个交易列表。 从交易中，我需要知道SplitTransaction的交易总额。

这是我的资源：

.factory('Transaction', ['$resource', '$http', '$rootScope', 'SplitTransaction', '$q', function($resource, $http, $rootScope, SplitTransaction, $q){ 
    var Transaction = $resource('/api/v1/transaction/:id', {}, { 
     query: { 
      method: 'GET', 
      isArray: true, 
      transformResponse: tastypieDataTransformer($http).concat(function (data, headersGetter) { 
       for (var idx in data) { 
        var transaction = data[idx]; 

        if (transaction.installment_of) { 
         var split = transaction.installment_of.split('/'); 
         var installmentId = split[split.length-1]; 

         SplitTransaction.get({id: installmentId}).$promise.then(function (installment) { 
          transaction.installment_total = installment.transactions.length; 
         }); 
        } 
       } 
       return data; 
      }) 
     } 
    }); 

这是HTML：

<tr class="transaction-row" ng-repeat="transaction in group.transactions"> 
    <td ng-bind="transaction.installment_total"></td> 
</tr> 

它显示了在呈现的HTML什么。

我试图用承诺：

transformResponse: tastypieDataTransformer($http).concat(function (data, headersGetter) { 
    for (var idx in data) { 
     var transaction = data[idx]; 

     if (transaction.installment_of) { 
      var split = transaction.installment_of.split('/'); 
      var installmentId = split[split.length-1]; 

      var deferred = $q.defer(); 

      SplitTransaction.get({id: installmentId}).$promise.then(function (installment) { 
       var installment_total = installment.transactions.length; 
       deferred.resolve(installment_total); 
      }); 
      transaction.installment_total = deferred.promise; 
     } 
    } 
    return data; 
}) 

现在结合似乎工作，但只显示[object Object]上的HTML。

我在做什么错？

编辑：

如果我设置transaction.installment_total的SplitTransaction.get回调外，它显示了HTML，所以绑定好的..就像这样：

if (transaction.installment_of) { 
    var split = transaction.installment_of.split('/'); 
    var installmentId = split[split.length-1]; 

    transaction.installment_total = 0; // shows "0" on the html 


    SplitTransaction.get({id: installmentId}, function (installment) { 
     ... 
    }); 
} 

出于某种原因，发生了什么回调内不反映绑定...

临时解决方案：

我删除代码从transformResponse到我加载Transaction的：

Transaction.query(filter).$promise.then(function (result) {      

    $.each(result, function (idx, transaction) {         
     if (transaction.installment_of) {           
      var split = transaction.installment_of.split('/');     
      var installmentId = split[split.length-1];       
      transaction.installment_total = 0;         

      SplitTransaction.get({id: installmentId}, function (installment) { 
       transaction.installment_total = installment.transactions.length; 
      });                 
     }                   
    });                   

    $scope.allTransactions = result;            
    $scope.transactionGroups = groupTransactions($scope.groupBy);     

    window.transactions = $scope.transactionGroups;        

}).finally(function() {$scope.loading = false;}); 

不能说为什么这个工程。也许对象得到transformResponse之后被拷贝，使得我在transaction上的回调范围没有用处......

Answer 1

这是不是很明显，什么是越来越绑定到您的HTML transaction.installment_total。通常它可能是$ rootScope的属性或绑定控制器的$ scope，我在这里没有看到任何控制器。

另外，不是很明显，什么是group.transactions。如果它是空的，则不会呈现任何内容。

但是，如果你以某种方式设法绑定transaction.installment_total到HTML，那么问题就在这里：

transaction.installment_total = deferred.promise; 

您Promsie对象绑定到HTML，你需要绑定这个承诺的结果：

deferred.promise.then(function(result) { 
    transaction.installment_total = result; 
}); 

这就是如果你想使用承诺。但还有另一种方法。

ngResource的方法返回承诺，您可以将其分配给您的视图，并且当数据可用时，此承诺将替换为此数据。

这是从documentation：

具有不呈现一个空对象的结果，一旦数据从所述服务器则该对象被填充以数据到达 和 视图自动重新呈现本身表示新的数据。这意味着 ，在大多数情况下，一个从来没有写一个回调函数的 操作方法

换句话说...

var result = SplitTransaction.get({id: installmentId}, function() { 
    transaction.installment_total = result.transactions.length 
}); 

...也应该工作。