Javascript AngularJS从服务加载数据

从填充到视图中的服务获取数据时遇到问题。我有一个这样定义的服务

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来广播事件并在控制器中侦听它，但这似乎不是实现这一点的正确方法。如果您能给我一些正确的建议，我将不胜感激

我认为这应该能解决你的问题

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
，然后只更改数据属性，而不是更改对
a
的引用，应该如下所示。正如NickWiggill评论中提到的，如果我们不返回承诺，undefined将被分配给nukeService.data

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

   }

我要做的是直接从服务中公开数据，并有一个方法来初始化这些数据。这有什么问题

服务：

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`
}

这很管用，但我能问一下原因吗？我假设这与。数据是json数据的容器而不是直接传递数据有关？顺便说一句，谢谢你的及时回复！这并不能解释异步加载--
$scope.data
返回为null，因为
getNukes（）
会立即返回，而无需等待
$http
@NickWiggill的结果，因为该视图可以解决问题。但是在控制器中使用数据可能会导致错误。正如@NickWiggill所说的，这不是异步的。还有其他方法可以解决这个问题吗？@arcone一般来说，您需要从
nukeService.getNukes
返回承诺，即
$http.get
返回，而不是返回
.data
（此时为
null
）。在调用代码中，必须使用
promise.then
提供回调，一旦promise实际解析，该回调将继续代码流。