Trigger.io + Angular.js並在調用forge.ajax後更新視圖

Question

出現問題，目前爲止看不到任何類似SO問題的解決方案。問題是這樣的：

使用Trigger.io的forge.ajax，我的Angular.js視圖在數據返回後沒有更新。我意識到這是因爲forge.ajax是一個異步函數，並且在視圖已經顯示之後返回數據。我試圖通過使用$ rootScope.apply（）來更新視圖，但對於我而言，它並不適用於我所見過的許多示例。

請參見下面的控制器代碼：

function OfferListCtrl($scope) { 

    $scope.offers = []; 

    $scope.fetchOffers = function(callback) { 

     $scope.offers = []; 

     var successCallback = function(odataResults) { 
      var rawJsonData = JSON.parse(odataResults); 
      var offers = rawJsonData.d; 
      callback(offers); 
     }; 

     var errorCallback = function (error){ 
      alert("Failure:" + error.message); 
     }; 

     forge.request.ajax({ 
      type: 'GET', 
      url: 'https://www.example.com/ApplicationData.svc/Offers', 
      accepts: 'application/json;odata=verbose', 
      username: 'username', 
      password: 'password', 
      success: successCallback, 
      error: errorCallback 
     }); 

    }; 

    $scope.fetchOffers(function(offers) { 
     $scope.offers = offers; 
     forge.logging.info($scope.offers); 
    }); 
} 

所有的代碼有工作正常，並且$ scope.offers被從數據庫提供的數據填充。日誌記錄功能顯示數據是正確的，格式正確。

我已經嘗試在邏輯位置（和一些不合邏輯的位置）使用$ rootScope.apply（），但無法獲取更新視圖。如果您有任何想法，我可以如何讓這個工作，我將不勝感激。

編輯：添加HTML

的HTML如下。用ng-click =「refresh（）」記下按鈕。這只是一種解決方法，所以我至少可以看到數據。它調用一個執行$ rootScope.apply（）的單行刷新函數，它會更新視圖。

<div ng-controller="OfferListCtrl"> 
     <h1>Offers</h1> 
     <ul> 
     <li ng-repeat="offer in offers"> 
      <p>Description: {{offer.Description}}<br /> 
       Id: {{offer.Id}}<br /> 
       Created On: {{offer.CreatedOn}}<br /> 
       Published: {{offer.Published}}<br /> 
      </p> 
     </li> 
     </ul> 
    <input type="button" ng-click="refresh()" value="Refresh to show data" /> 
    </div> 

Answer 1

您需要更改

$scope.fetchOffers(function(offers) { 
    $scope.$apply(function(){ 
     $scope.offers = offers; 
    }); 
    forge.logging.info($scope.offers); 
}); 

這是因爲對$scope所有更改必須的角度範圍內進行，在這種情況下，因爲您使用調用ajax請求回調沒有在角度框架內執行，這就是爲什麼它不起作用。

在這種情況下，您可以使用$scope.$apply()在角度框架內執行代碼。

看那$apply()方法DOC

$申請（）是用來從 角框架之外在角度來執行的表達式。 （例如，來自瀏覽器DOM事件， setTimeout，XHR或第三方庫）。因爲我們正在調用 角度框架，我們需要執行適當的作用域生命週期 異常處理，執行手錶。

Answer 2

做到這一點

function MyController($scope, myService) 
{ 
    myService.fetchOffers(data){ 
     //assign your data here something like below or whateever 
     $offers = data 
     $scope.$apply(); 
    } 
}); 

感謝 DHIRAJ

Answer 3

當我這樣做，我有這樣的錯誤：「$消化正在進行中」 ...... 我與$ Q的工作...

有人knwo我怎麼能解決這個問題 ？

是的，這是因爲你的數據速度夠快，角度還沒有完成他的渲染，所以更新不能更新「外」的角度。

所以使用事件： http://bresleveloper.blogspot.co.il/2013/08/angularjs-and-ajax-angular-is-not.html