解決資源依賴的另一個資源

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 
}); 

...也應該工作。