Angularjs从函数外部获取对象值

Angularjs get object values outside of function

本文关键字:取对象 获取 外部 函数 Angularjs      更新时间:2023-09-26

我需要得到localeData值打印出下面的函数。我知道如何在函数的一边打印,就像我在这里做的。我试过这个,但没有工作。

    $http.post(SERVER_URL + 'getLocaleData').success(function(localeData) {
        console.log(localeData);
        }).error(function(err) {
            alert('warning', err.message);
        });
        //need to get that value here.
        console.log(localeData);

编辑

实际上我需要做的是这个

app.factory('customLoader', function($http, $q, SERVER_URL) {
    return function(options) {
        var deferred = $q.defer();
        // do something with $http, $q and key to load localization files
        $http.post(SERVER_URL + 'getLocaleData').success(function(localeData) {
         //do something here to localData
        }).error(function(err) {
            alert('warning', err.message);
        });
        deferred.resolve(localeData);
        return deferred.promise;
    };
});

这就是我需要的。最后我需要发送localeData

你不需要创建&自己解决问题。有一个更简单的方法。(同样在您给出的示例中,您在底层ajax完成之前解决promise)

Angular.js的$http服务也遵循$q接口!所以你可以这样写:

app.factory('customLoader', function($http, $q, SERVER_URL) {
  return function(options) {
    var promise = $http.post(SERVER_URL + 'getLocaleData')
      .then(function(localeDataBag) {
         var localeData = localeDataBag.data; // .data of 'then' equals to what .success returns.            
         modifiedLocaleData = localeData++;  // do something here to localData
         return modifiedLocaleData; // This is the new result
        })
      .catch(function(err) {
        console.log(err);
        return $q.reject(err); // This is the new result if something failed. Since we are chaining promises, we should keep failure state.
      });
    return promise;
  };
});

你不需要$q来完成你的目标:

app.factory('customLoader', ["$http", "SERVER_URL", function($http, SERVER_URL) {
    return function(options) {
        return $http.post(SERVER_URL + 'getLocaleData');
    };
}]);

因为$http和它所有的方便方法实际上返回一个承诺。在这种情况下,您可以这样使用该服务:

customLoader(options).success(function(localeData){
    //do something here to localData
}).error(function(err){
    alert('warning', err.message);
});

如果您确实必须使用$q,那么应该这样做:

app.factory('customLoader', ["$http", "$q", "SERVER_URL", function($http, $q, SERVER_URL) {
    return function(options) {
        return $q(function(resolve, reject){
            $http.post(SERVER_URL + 'getLocaleData').success(function(localeData) {
                //do something here to localData
                resolve(localeData); // ultimately you ought to resolve inside this function
            }).error(function(err) {
                alert('warning', err.message);
                reject(localeData); // ultimately you ought to reject inside this function
            });
        });
    };
}]);

JS是异步的,这基本上意味着您的最后一个console.log将在服务器返回任何数据之前执行。所以你必须在你的两个承诺中都这样做:

$http.post(SERVER_URL + 'getLocaleData').success(function(localeData) {
    console.log(localeData);
    }).error(function(err) {
         console.log(err);
        alert('warning', err.message); //Just in case you didn't know, this line supposes that your server returns a JSON object with a "message"-property
    });

这样,您的服务器响应将在成功和失败时都被console.log 'ed。

参考

编辑:如果你真的想用另一种方式:

var response; //First, declare a variable in the parent scope.
$http.post(SERVER_URL + 'getLocaleData').success(function(localeData) {
    response = localeData; //Assign the response data to the variable.
    console.log(localeData);
    }).error(function(err) {
        alert('warning', err.message); //Just in case you didn't know, this line supposes that your server returns a JSON object with a "message"-property
    });
    console.log(response);
但是,该示例不会像您期望的那样求值。最后一个console.log将只记录undefined

通过以下方式,您可以在控制器中访问工厂外的服务器响应:

app.factory('customLoader', function ($http, $q) {
        return {
            response: {},
            getLocalData: function (param) {
                var deferred = $q.defer();
                $http.post(SERVER_URL + 'getLocaleData', param).
                    success(function (data, status, headers, config) {
                        deferred.resolve(data);
                    }).
                    error(function (data, status, headers, config) {
                    });
                return deferred.promise;
            }
        }
    });

 app.controller('yourCtrl', function($scope,customLoader) {
       $scope.GetLocaleData= function() {    
                customLoader.getLocalData({
                    Role: role,
                    Email_Id: $scope.Email,
                    Pwd: $scope.Password
                }).then(function(localeData) {
                    $scope.Data = localeData;                        
                });        
        }
 }); 

localeData仅限于.success函数的作用域。你不能把它移到外面,除非你给它赋值其他变量。

var data = ""
$http.post(SERVER_URL + 'getLocaleData').success(function(localeData) {
    data = localeData;
    }).error(function(err) {
        alert('warning', err.message);
    });
//need to get that value here.
console.log(data);

但是不要期望在data中得到所需的值,直到您得到响应返回。$http.post is async

看一下承诺来克服这些问题,因为它们在angular世界中被广泛使用。

更新:

正如您在编辑中所做的那样,您可以使用$q服务,如:

app.factory('customLoader', function($http, $q, SERVER_URL) {
    return function(options) {
        var deferred = $q.defer();
        // do something with $http, $q and key to load localization files
        $http.post(SERVER_URL + 'getLocaleData').success(function(localeData) {
         //do something here to localData
        }).error(function(err) {
            alert('warning', err.message);
        });
        deferred.resolve(localeData);
        return deferred.promise;
    };
});

或者,您可以简单地返回$http.post,它本身返回一个promise

app.factory('customLoader', function($http, $q, SERVER_URL) {
    return function(options) {        
        return $http.post(SERVER_URL + 'getLocaleData');
    };
});

无论哪种方式,您都返回promise对象,而不仅仅是您从服务器获得的实际响应。localeData可以通过以下方式访问:

customLoader().success(function(res){
   console.log(res);
 }).error(function(){
    //show some error message
 })