（Angularjs）如何$ http.get数据并将其存储在服务 [英] (Angularjs) How to $http.get data and store it in service

问题描述

正如你将看到我是在AngularJS新的JS和所有= Web开发），真的很抱歉，但我尝试。

As you will see i'm new in AngularJS, JS and in web development at all =) really sorry for that but i try to.

我尝试建立一个庞大的网络表格（约200个不同的领域）与AngularJS控制器。我需要从控制器到根数据源访问。 AngularJS团队问不使服务只是用于存储数据，但我想为加载服务和保存（在服务器上启动时进入以.json文件）的数据。

I try to build a massive webform (about 200 different fields) with AngularJS controllers. I need access from controller to root data source. AngularJS team ask do not make Services just for storing data, but i want to make service for load and save data (at start into .json files on a server).

服务：

AppName.factory('MasterData', ['$rootScope', '$http', '$q', '$log', 
    function($rootScope, $http, $q, $log) {

    var responseData;
    $http.get('/getdata.php').then(function (response) {
        responseData = response.data;
        console.log(response.data);
    });

    return responseData;

}]);

控制器：

AppName.controller('justController', ['$scope', 'MasterData', '$log',
    function ($scope, MasterData, $log) {
        $scope.data = MasterData.justControllerSectionData;
        console.log(MasterData);
    }
]);

控制器返回undefined。但是从服务CONSOLE.LOG返回对象。
我觉得这个问题太容易了，但我无法找到如何解决它:(
我也不能使用函数像.getData（）从控制器到服务，因为它从服务器每次询问数据的任何控制器的负荷。我在AngularJS应用与12-14控制器（全通过网页表单分成部分）的路线，我认为这是很好的得到后端数据一次。

Controller return undefined. But console.log from service returns the object. I feel that the problem is too easy, but i can't find how to solve it :( Also i can't use function like .getData() from controller to service because it ask the data from server each time any controller loads. I have the routes in AngularJS app with 12-14 controllers (full webform divided by sections) and i think it is good to get the data from backend once.

P.S。我认为有问题的承诺，但是当我尝试使用code是这样的：

P.S. I think there is problem with promises, but when i try to use code like this:

var defer = $q.defer();
$http.get('/getdata.php').success(function(data){
    defer.resolve(data);
});
return defer;

我有决心，有目标，拒绝等。真的不明白我可以用它做：（

I've got object with resolve, reject and so on. And really can't understand what can i do with it :(

帮助我获得在控制器中的数据：）

Help me to get the data in controller :)

推荐答案

您code不起作用，因为你提供给成功回调（）中你的服务是被异步调用;您的服务已返回之后，那就是：

Your code doesn't work, because the callback you supplied to success() in your service is called asynchronously; after your service has returned, that is:

的顺序是这样的：

1. 的函数在MasterData运行。在 $ http.get 请求启动，并附加了承诺回调。 responseData 在此回调引用（又名关闭了）。


2. 函数从服务到你的控制器返回。 responseData 尚未设定，它不会从返回停止父范围功能。


3. $ http.get 成功和 responseData 设置在服务无法访问但为控制器。



1. The function in MasterData is run. The $http.get request is launched and attached the promise callback. responseData is referenced in this callback (aka. "closed over").
2. The function returns from the service to your controller. responseData has not been set yet, which doesn't stop the parent scope function from returning.
3. $http.get succeeds and responseData is set in the service however unreachable for the controller.

如果嵌套函数在成功的作用域（）不明确你的，我建议你在阅读的JavaScript闭包（甚至更好，在一般情况）例如这里。

If the scoping of the nested function in success() is not clear to you, I'd recommend reading about closures in JavaScript (or even better, in general), for example here.

您可以用这样的服务，实现自己的目标

You can achieve your goal with a service like this:

function($q, $http, /* ... */) {    
    return {
        getData: function() {
            var defer = $q.defer();
            $http.get('/getdata.php', { cache: 'true'})
            .success(function(data) {
                defer.resolve(data);
            });

            return defer.promise;
    };
}

的 $ HTTP 服务会很乐意你的缓存响应数据，所以你不必。请注意，您需要检索自许你的延迟红色物体，使这项工作。

The $http service will happily cache your response data, so you don't have to. Note that you need to retrieve the promise from your deferred object to make this work.

该控制器是这样的：

/* omitted */ function($scope, YourService) {
    YourService.getData().then(function(data) {
        $scope.data = data;
    });
}

这篇关于（Angularjs）如何$ http.get数据并将其存储在服务的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！