1

angularコントローラー内で、次のメソッドが定義されています

$scope.searchListing = function() {
    $http({
        url: App.Url.to('listing/feed/21312')
    }).success(function(data, status, headers, config) {
        $scope.data = data;
    });
}

ビューでは、 $scope.data.listing がループされています

<div class="item" ng-repeat="property in data.listings"><!-- stuff --></div>

searchListing は ng-click を使用してトリガーされ、物事は完全に機能します。ただし、アプリへの API 呼び出しを処理する別の API があり、それは jQuery に基づいています。jQuery ベースの API を統合した後

$scope.searchListing = function() {
    App.Listing.getListing().done(function(data){
        $scope.data = data;
    });
}

API は jqXHR オブジェクトを返すので、それらの promise メソッドを呼び出すことができます。問題は、データが $scope.data に割り当てられても、ビューが更新されないことです。ajaxリクエストが完了した後、コントローラーにアクセスして、データが割り当てられたかどうかを確認しました

angular.element('[ng-controller=listingController]').scope().data

データは表示されましたが、ビューが更新されないのはなぜですか?

4

1 に答える 1

2

Angular モデル ( $scope) のデータが変更されると、Angular はこれを認識し、更新されたデータでビューを再レンダリングするダイジェスト ループをトリガーします。

ただし、このデータの変更が Angular のビューポートの外にあるコールバックで発生すると、Angular は変更を監視できません。これは、データ変更が Angular の一部ではない jQuery promise で発生している場合に発生しています。この場合、次のようにダイジェスト ループを手動でトリガーする必要があります。

App.Listing.getListing().done(function(data){
        $scope.data = data;

        // make sure your app is not currently in a digest loop
        if (!$scope.$$phase)
            $scope.$apply(); // trigger digest loop
});
于 2013-04-12T20:55:43.257 に答える