在http.post请求之外访问作用域

13 浏览
0 Comments

在http.post请求之外访问作用域

我正在使用AngularJS的http.post进行发布，将response.data放入successCallback函数中的scope中。console.log写入scope数据，但我无法在另一个函数中访问scope数据。

Init调用请求的函数。

$scope.init = function(group_year_id,year)
{
    accessScopeFunction();
    foo();
};

这是被调用的函数

function accessScopeFunction() {
    $http({
        method: 'POST',
        url: 'http://localhost/sjb/public/admin/groups/assing/angular/get/databasename'
    }).then(function successCallback(response) {
        $scope.getDatabaseName = response.data.event_db;
        console.log($scope.getDatabaseName);            
    }, function errorCallback(response) {
        return 'Fault';
    });
};

我想将$scope.getDatabaseName传递给另一个函数

function foo() {
    $http({
        method: 'POST',
        url: 'http://localhost/sjb/',
        data: {'databasename':$scope.getDatabaseName}
    }).then(function successCallback(response) {
    }, function errorCallback(response) {
    });
};

我阅读了很多关于promise的东西，AngularJS文档等等，但是我找不到适合我的有效解决方案。

0

2 答案

0 Comments

问题的出现原因：在$http.post请求之外，无法访问到$scope.getDatabaseName的值。

解决方法：将accessScopeFunction()与foo()函数进行链式调用，以便在第二个函数中可以访问到第一个函数的结果。

以下是修正后的代码：

$scope.init = function(group_year_id,year)
{
  accessScopeFunction().then(function(result){
    foo(result);
  });
};
function accessScopeFunction() {
  return  $http({
    method: 'POST',
    url: 'http://localhost/sjb/public/admin/groups/assing/angular/get/databasename'
  }).then(function successCallback(response) {
    $scope.getDatabaseName = response.data.event_db;
    return $scope.getDatabaseName;
  }, function errorCallback(response) {
    return 'Fault';
  });
};
function foo(databaseName) {
  $http({
    method: 'POST',
    url: 'http://localhost/sjb/',
    data: {'databasename': databaseName}
  }).then(function successCallback(response) {
  }, function errorCallback(response) {
  });
};

通过将accessScopeFunction()的结果传递给foo()函数，我们可以在$http.post请求之外访问到$scope.getDatabaseName的值。

0
0 Comments

问题出现的原因是在调用accessScopeFunction()函数时，它的处理过程还没有完成，就立即调用了foo()函数。解决方法是使用$http调用返回的promise来等待accessScopeFunction()的完成。

具体的解决方法是，将accessScopeFunction()和foo()函数改造成返回promise的形式。首先在accessScopeFunction()函数中，使用$http调用返回的promise，并在成功的回调函数中处理返回的数据。然后将这个promise返回。接着在foo()函数中，也使用$http调用返回的promise，并在成功的回调函数中处理返回的数据。最后将这个promise返回。

最后，在$scope.init()函数中，调用accessScopeFunction()函数并使用then()回调来调用foo()函数。

以下是修改后的代码：

function accessScopeFunction() {
    var promise = $http({
            method: 'POST',
            url: 'http://localhost/sjb/public/admin/groups/assing/angular/get/databasename'
        }
    ).then(
        function successCallback(response) {
            $scope.getDatabaseName = response.data.event_db;
            console.log($scope.getDatabaseName);
        },
        function errorCallback(response) {
            return 'Fault';
        }
    );
    // 返回promise
    return promise;
};
function foo() {
    var promise = $http({
            method: 'POST',
            url: 'http://localhost/sjb/',
            data: {
                'databasename': $scope.getDatabaseName
            }
        }
    ).then(
        function successCallback(response) {
        }, function errorCallback(response) {
        }
    );
    return promise;
};
$scope.init = function(group_year_id, year) {
    accessScopeFunction().then(
        function() {
            foo();
        }
    );
};

foo()函数也可以以相同的方式使用：

foo().then(function() { ... })

通过以上的修改，我们解决了在调用$http请求时，accessScopeFunction()函数还没有完成处理就立即调用foo()函数的问题。现在，foo()函数会等待accessScopeFunction()函数的完成后才被调用。

0