javascript - AngularJS 从服务加载数据

Question

我在从填充到我的 View 的服务中获取数据时遇到问题。我有这样定义的服务

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

和我的 Controller

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



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

    $scope.nukes = nukeService.getNukes();

}

如果我使用来自 Controller 的 $http.get 数据填充正常，但是，如果我尝试从服务调用数据，我什么也得不到。我知道查询是异步的，但我很难理解如何在返回数据后填充 $scope 变量。我可以使用 $rootscope 来广播事件并在 Controller 中监听它，但这似乎不是完成此操作的正确方法。我真的很感激任何关于如何以正确的方式做到这一点的建议。

Answer 1

我认为这应该可以解决您的问题

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，而是更改了 nukeService.nukes 从引用对象 a 到对象 b。但是您的 $scope.nukes 并不知道这个重新分配，它仍然指向对象 a。

在这种情况下，我的解决方案是传递一个对象 a 和属性 data 然后只更改数据属性而不是更改对 a 的引用>