如何在 AngularJS 中将数据从一个异步函数传递到另一个异步函数

Question

如何在 angular 中将全局变量值从一个函数传递到另一个函数？

我有 2 个全局变量：

$scope.genewtId = null;
$scope.data1 = null;

我有 2 个 angular 函数，如下所示：

$scope.getID = function() {
    Service1.getId("abc").then(function(response){
        $scope.genewtId = response.data[0].Id;
        console.log($scope.genewtId);

    }, function(error){
        console.log(error.statusText);
    });
};

$scope.getDetails = function() {
    Service2.getDetails($scope.genewtId).then(function(response){
        // here response is having an error
        $scope.data1 = response.data;
        console.log($scope.data1.toString());
    }, function(error){
        console.log(error.statusText);
    });
};

当我将 $scope.genewtId 的值从一个函数传递到另一个函数时，出现错误

message: "Failed to convert value of type 'java.lang.String' to required type 'java.lang.Integer'; nested exception is java.lang.NumberFormatException: For input string: "null""

但是，console.log($scope.genewtId); 返回一个值 787651，这意味着它不为空。

请建议是否可以使用$rootScope.$broadcast

实现

Answer 1

我能想到的唯一原因是asynchronous调用了promises。发生的事情是：

不知何故，在 Service1.getId("abc").then 的承诺完成后设置 $scope.genewtId 的值之前调用 Service2.getDetails($scope.genewtId)，因此该值仍然是 null

尝试：

$scope.getID = function(isCalledAfterDetails) {
    Service1.getId("abc").then(function(response){
        $scope.genewtId = response.data[0].Id;
        console.log($scope.genewtId);
        if(isCalledAfterDetails && $scope.genewtId !== null){
            $scope.getDetails();
        }

    }, function(error){
        console.log(error.statusText);
    });
};

$scope.getDetails = function() {
    if($scope.genewtId === null){
        $scope.getID(true);
    }else{
        Service2.getDetails($scope.genewtId).then(function(response){
            // here response is having an error
            $scope.data1 = response.data;
            console.log($scope.data1.toString());
        }, function(error){
            console.log(error.statusText);
        });
    }

};

即使这种方法可行，我也强烈建议您以更好的方式实现函数调用，因为 $scope.getDetails() 依赖于 $scope.getID() 来设置 $scope.genewtId 的值。

如果您需要有关如何实施它的建议，请使用用例和更多代码更新问题

更新

$scope.getID = function() {
    Service1.getId("abc").then(function(response){
        $scope.genewtId = response.data[0].Id;
        $scope.getDetails();
    }, function(error){
        console.log(error);
    });
};

$scope.getDetails = function() {
        Service2.getDetails($scope.genewtId).then(function(response){
            // here response is having an error
            $scope.data1 = response.data;
            console.log($scope.data1.toString());
        }, function(error){
            console.log(error.statusText);
        });        
};

使用服务

在service.js

getDetails = function(id){
    var deferred = $q.derfer();
    $http.get('/user/'+id).then(function(response){
        var newId = response.data[0].Id;
        $http.get('/user/details'+newId).then(function(details){
            deferred.resolve(details)
        })
    })      
    return deferred.promise;
}

controller.js

$scope.getDetails = function() {
        MySvc.getDetails("abc").then(function(response){
            console.log(response) // your details here
        }, function(error){
            console.log(error.statusText);
        });        
};

Answer 2

两个服务的承诺需要

将第一个函数修改为return一个promise：

$scope.getID = function() {
    return Service1.getId("abc").then(function(response){
        $scope.genewtId = response.data[0].Id;
        console.log($scope.genewtId);
        return response.data[0].Id;
    }, function(error){
        console.log(error.statusText);
        throw error;
    });
};

将第二个函数修改为return一个承诺并接受一个参数：

$scope.getDetails = function(id) {
    var genewtID = id || $scope.genewtId;
    return Service2.getDetails(genewtId).then(function(response){
        $scope.data1 = response.data;
        console.log($scope.data1.toString());
        return response.data;
    }, function(error){
        console.log(error.statusText);
        throw error;
    });
};

然后两个承诺：

var promise = $scope.getId();

var promise2 = promise.then(function(id) {
                   return $scope.getDetails(id);
               });

var promise2.then(function(data) {
     console.log(data);
}).catch(function(error) {
     console.log(error);
});

通过使用 getId 承诺的 .then 方法，代码在向 getDetails 发出请求之前等待 id 值从服务器到达。

因为调用承诺的 .then 方法 return 是一个新的派生承诺，所以很容易创建承诺链。可以创建任意长度的链，并且由于一个 promise 可以用另一个 promise 解决（这将进一步推迟其解决方案），因此可以 pause/defer 在链中的任何点解决 promise。

有关详细信息，请参阅

Answer 3

似乎异常来自服务器端。

Failed to convert value of type 'java.lang.String' to required type 'java.lang.Integer'; nested exception is java.lang.NumberFormatException: For input string: "null"

由于 console.log(error.statusText);

，它正在控制台上打印

在API中使用该值时需要验证逻辑。

如何在 AngularJS 中将数据从一个异步函数传递到另一个异步函数

How to pass data from one asynchronous to another asynchronous function in AngularJS

javascript

angularjs

angular-promise

angularjs-service

angularjs-http

如何在 angular 中将全局变量值从一个函数传递到另一个函数？

更新

使用服务

两个服务的承诺需要