14

ビューに入力されたサービスからデータを取得する際に問題が発生しています。私はそのように定義されたサービスを持っています

app.factory('nukeService', function($rootScope, $http) {
    var nukeService = {};

    nukeService.nuke = {};

    //Gets the list of nuclear weapons
    nukeService.getNukes = function() {
        $http.get('nukes/nukes.json')
            .success(function(data) {
                nukeService.nukes = data;
            });

        return nukeService.nukes;
    };

    return nukeService;
});

そして私のコントローラー

function NavigationCtrl($scope, $http, nukeService){



    /*$http.get('nukes/nukes.json').success(function(data) {
        $scope.nukes = data;
    });*/

    $scope.nukes = nukeService.getNukes();

}

コントローラーから $http.get を使用すると、データは正常に読み込まれますが、サービスからデータを呼び出そうとすると、何も取得されません。クエリが非同期であることは理解していますが、データが返された後に $scope 変数を設定する方法を理解するのに苦労しています。$rootscope を使用してイベントをブロードキャストし、コントローラーでリッスンすることもできますが、これはこれを達成するための正しい方法とは思えません。これを正しい方法で行う方法についてアドバイスをいただければ幸いです。

4

3 に答える 3

28

これで問題が解決すると思います

app.factory('nukeService', function($rootScope, $http) {
    var nukeService = {};

    nukeService.data = {};

    //Gets the list of nuclear weapons
    nukeService.getNukes = function() {
        $http.get('nukes/nukes.json')
            .success(function(data) {
                nukeService.data.nukes = data;
            });

        return nukeService.data;
    };

    return nukeService;
});

function NavigationCtrl($scope, $http, nukeService){

    $scope.data = nukeService.getNukes();

    //then refer to nukes list as `data.nukes`

}

これはオブジェクト参照の問題です。

nukeService.getNukes()オブジェクトへの参照を取得しているときに呼び出すとa、変数$scope.nukesはそのメモリの場所を参照します。

設定時のリモートサーバー呼び出しの後、nukeService.nukes = data;オブジェクトを変更しているのではなく、参照オブジェクトからオブジェクトにa変更しています。しかし、あなたはこの再割り当てについて知らず、まだ object を指しています。nukeService.nukesab$scope.nukesa

aこの場合の私の解決策は、オブジェクトにプロパティを渡し、data参照を変更する代わりにデータプロパティのみを変更することですa

于 2013-03-01T16:01:26.510 に答える
9

これは次のようになります。NickWiggill のコメントで述べたように、promise を返さない場合、nukeService.data に undefined が割り当てられます。

app.factory('nukeService', function($rootScope, $http) {
    var nukeService = {};
    //Gets the list of nuclear weapons
    nukeService.getNukes = function() {
       return $http.get('nukes/nukes.json');
    };

    return nukeService;
});


  function NavigationCtrl($scope, $http, nukeService){
     nukeService.getNukes().then(function(response){

        $scope.data = response.data;
    });

   }
于 2014-09-10T20:43:25.680 に答える
4

私がしていることは、サービスから直接データを公開し、このデータを初期化するメソッドを用意することです。これの何が問題なのですか?

サービス:

app.factory('nukeService', function($scope, $http) {
    var data = {};
    data.nukes = [];

    //Gets the list of nuclear weapons
    var getNukes = function() {
        $http.get('nukes/nukes.json').success(function(data) {
                data.nukes = data;
        });
    };

    // Fill the list with actual nukes, async why not.
    getNukes();

    return {
        data : data
        // expose more functions or data if you want
    };
});

コントローラ:

function NavigationCtrl($scope, nukeService){
     $scope.data = nukeService.data;
     //then refer to nukes list as `$scope.data.nukes`
}
于 2015-01-28T17:30:42.027 に答える