微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

AngularJS从服务加载数据

如何解决AngularJS从服务加载数据

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

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

解决方法

我在将服务中的数据填充到视图中时遇到问题。我有这样定义的服务

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广播事件并在控制器中侦听它,但这似乎并不是完成此事件的正确方法。对于如何正确执行此操作的任何建议,我将不胜感激。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。