12

サーバーからいくつかのクライアント データをフェッチするサービスがあります。

app.factory('clientDataService', function ($http) {
    var clientDataObject = {};
    var cdsService = {
        fetch: function (cid) {
            //$http returns a promise, which has a then function, which also returns a promise
            var promise = $http.get('/clients/stats/' + cid + '/').then(function (response) {
                // The then function here is an opportunity to modify the response
                console.log(response);
                // The return value gets picked up by the then in the controller.
                clientDataObject = {'data': response.data, 'currentClientID': cid};
                return clientDataObject;
            });
            // Return the promise to the controller
            return promise;
        }
    };
    return cdsService;
});

次に、1つのコントローラーで次のことを行います。

//get stats
clientDataService.fetch($scope.id).then(function (response) {
    $scope.client_data = {
        'statistics': response.data
    }
});

これはすべて非常にうまく機能します。ただし、そのサービスの別のコントローラーからウォッチを実行して、データが変更されたときにスコープを更新しようとしています。http 要求を再度開始する必要はありません。

$scope.$watch('clientDataService.clientDataObject', function (cid) {
    alert(cid);
});

今のところ警告していますが、トリガーされることはありません。ページが最初に読み込まれると、「未定義」というアラートが表示されます。コンソールにエラーはなく、すべての $injects に問題はありませんが、サービスでデータが変更されたことを認識していないようです。時計で何か間違ったことをしていますか?

どうもありがとうベン

4

2 に答える 2

13

clientDataService.clientDataObject はコントローラーのスコープの一部ではないため、そのオブジェクトの変更を監視することはできません。$rootScope をサービスに挿入してから、コントローラーのスコープに変更をブロードキャストする必要があります。

app.factory('clientDataService', function ($rootScope, $http) {
    var clientDataObject = {};
    var cdsService = {
        fetch: function (cid) {
            var promise = $http.get('/clients/stats/' + cid + '/').then(function (response) {
                // The then function here is an opportunity to modify the response
                console.log(response);
                // The return value gets picked up by the then in the controller.
                clientDataObject = {'data': response.data, 'currentClientID': cid};
                $rootScope.$broadcast('UPDATE_CLIENT_DATA', clientDataObject);
                return clientDataObject;
            });
            // Return the promise to the controller
            return promise;
        }
    };
    return cdsService;
});

次に、コントローラーで次を使用して変更をリッスンできます。

$scope.$on('UPDATE_CLIENT_DATA', function ( event, clientDataObject ) { });
于 2013-08-14T09:02:18.177 に答える
9

別のアプローチは次のとおりです。

  1. 新しいサービスを定義する

    app.factory('DataSharingObject', function(){
       return {};
    }
    
  2. データを保存するコントローラーにこの新しいサービスを含めます

    app.factory('clientDataService', function ($http, DataSharingObject) {
        DataSharingObject.sharedata = ..assign it here
    }
    
  3. データにアクセスするコントローラーにこの新しいサービスを含めます

    app.factory('clientReceivingService', function ($http, DataSharingObject) {
       ..use it here... = DataSharingObject.sharedata
    }
    
于 2014-01-05T16:15:02.037 に答える