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()を実行する1行の更新関数を呼び出します。

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

これは、すべての変更を$scopeAngularスコープ内で行う必要があるためです。この場合forge、コールバックを使用してajaxリクエストを呼び出しているため、Angularフレームワーク内で実行されていないため、機能していません。

この場合、 $scope。$apply()を使用して、Angularフレームワーク内でコードを実行できます。

$apply()メソッドのドキュメントを見てください

$ apply()は、Angularフレームワークの外部からAngularで式を実行するために使用されます。(たとえば、ブラウザーのDOMイベント、setTimeout、XHR、またはサードパーティのライブラリから)。Angularフレームワークを呼び出しているため、例外処理の適切なスコープライフサイクルを実行し、ウォッチを実行する必要があります。

于 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

これを行うと、「$digestはすでに進行中です」のようなエラーが発生します...$qを使用しています...

誰かがこの問題を解決する方法を知っていますか?

はい、これは、データが十分に高速になり、Angularがレンダリングを完了していないため、更新がAngularの「外側」をまだ更新できない場合に発生します。

したがって、イベントを使用します:http: //bresleveloper.blogspot.co.il/2013/08/angularjs-and-ajax-angular-is-not.html

于 2013-08-16T14:52:05.810 に答える