在我自己的服务中使用 $http - 变量不会持续存在

Question

我尝试使用服务从服务器获取一些数据，但我遇到了一个问题：当我打印 'myData.length' 时，即使控制台也注销了长度，当我试图找到 '$[ 的长度时=16=]' 控制器变量它告诉我它是未定义的。

要在我自己的服务中使用 $http 服务，我应该怎么做？

app.controller('mainCtrl', ['$scope', 'mapServ',
function($scope, mapServ) {
    $scope.test = [];
    $scope.test = mapServ.test;
    console.log('$scope.test = ' + $scope.test.length);
}]);

app.factory('mapServ', ['$http', function ($http) {
    var path = "file path to my server data";
    var out = {};
    var myData = [];
    out.test = $http.get(path).then(function (response) {
            myData = response.data;
            console.log(myData.length);
    });
    return out;
}]);

Answer 1

在您的代码中，您无需等待 $http 完成。

$http是异步调用

你应该这样做

app.controller('mainCtrl', ['$scope', 'mapServ',
    function($scope, mapServ) {
        $scope.test = [];
        $scope.test = mapServ.test.then(function(response) {
            console.log(response.data);
        }, function(error) {
            //handle error
        });;
    }
]);

app.factory('mapServ', ['$http', function($http) {
    var path = "file path to my server data";
    var out = {};
    var myData = [];
    out.test = $http.get(path);
    return out;
}]);

Answer 2

您从工厂进行的 $http 调用是异步的，因此它不会等待，直到响应到来，它会继续执行脚本的下一次执行，即这个问题只能尝试Weedoze的回答，这是正确的做法。

Answer 3

以这些service和controller为例，在写代码的时候要遵循John Papa's style guide

服务

(function() {
            'use strict';

            angular
                .module('appName')
                .factory('appAjaxSvc', appAjaxSvc);

            appAjaxSvc.$inject = ['$http', '$q'];

            /* @ngInject */
            function appAjaxSvc($http, $q) {

                return {
                    getData:function (path){

                      //Create a promise using promise library
                        var deferred = $q.defer();

                        $http({
                            method: 'GET', 
                            url: "file path to my server data"
                        }).
                        success(function(data, status, headers,config){
                            deferred.resolve(data);
                        }).
                        error(function(data, status, headers,config){
                            deferred.reject(status);
                        });

                        return deferred.promise;
                    },
                };
            }
        })();

控制器

    (function() {

        angular
            .module('appName')
            .controller('appCtrl', appCtrl);

        appCtrl.$inject = ['$scope', '$stateParams', 'appAjaxSvc'];

        /* @ngInject */
        function appCtrl($scope, $stateParams, appAjaxSvc) {
            var vm = this;
            vm.title = 'appCtrl';

            activate();

            ////////////////

            function activate() {

                appAjaxSvc.getData().then(function(response) {
                    //do something
                }, function(error) {
                    alert(error)
                });

            }
        }
    })();

在我自己的服务中使用 $http - 变量不会持续存在

Using $http inside my own service - variable does not persist

angularjs

angular-http

angular-services