2

遇到问题，到目前为止无法为看似相似的 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 会使用数据库中的 Offer 数据填充。记录功能显示数据正确，格式正确。

我曾尝试在逻辑位置（以及一些不合逻辑的位置）使用 $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>
4

3 回答 3

5

你需要改变

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

这是因为对 的所有更改$scope都必须在角度范围内进行，在这种情况下，由于您使用forge回调调用 ajax 请求并没有在角度框架内执行，这就是它不起作用的原因。

在这种情况下，您可以使用$scope.$apply()在 Angular 框架内执行代码。

查看$apply()方法文档

$apply() 用于从 Angular 框架外部执行 Angular 表达式。（例如来自浏览器 DOM 事件、setTimeout、XHR 或第三方库）。因为我们正在调用 Angular 框架，所以我们需要执行适当的异常处理范围生命周期，执行 watch。

于 2013-04-21T13:28:04.373 回答
0

做这个

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

谢谢 Dhiraj

于 2013-04-02T11:23:17.883 回答
0

When I do that I have an error like : "$digest already in progress"... I'm Working with $q...

Someone knwo how I can resolve this issue ?

yes, this is caused where ur data comes fast enough and angular has not finished his rendering so the update cant update "outside" angular yet.

so use events: http://bresleveloper.blogspot.co.il/2013/08/angularjs-and-ajax-angular-is-not.html

于 2013-08-16T14:52:05.810 回答