如何在AngularJS中將數據從一個異步傳遞到另一個異步函數

Question

如何以角度將全局變量值從一個函數傳遞給另一個函數？

我有2個全局變量，如：

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

我有2個角度函數，如下所示：

$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值從一個函數傳遞給另一個函數時，出現錯誤

消息：“無法將類型'java.lang.String'的值轉換為必需的類型'java.lang.Integer'；嵌套異常為java.lang.NumberFormatException：對於輸入字符串：“ null””

但是， console.log($scope.genewtId); 返回值787651 ，這表示它不為空。

請建議是否可以使用$rootScope.$broadcast來實現

Answer 1

我能想到的唯一原因是因為promises的asynchronous調用。 發生的事情是：

以某種方式，您在Service1.getId("abc").then的承諾完成之后設置$scope.genewtId的值之前，先調用Service2.getDetails($scope.genewtId) Service1.getId("abc").then ，該值保持為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.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

這兩個服務的承諾需要鏈接在一起

修改第一個函數以返回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;
    });
};

修改第二個函數以既返回promise又接受參數：

$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);
});

通過使用.then該方法getId承諾，代碼等待id值從服務器發出請求之前到達getDetails 。

因為調用promise的.then方法會返回新的派生promise，所以很容易創建promise的鏈。 可以創建任意長度的鏈，並且由於一個承諾可以用另一個承諾來解決（這將進一步推遲其解決方案），因此可以在鏈中的任何點暫停/推遲對承諾的解決。

有關更多信息，請參見

• AngularJS $ q服務API參考-鏈式承諾
• 您錯過了承諾的重點

Answer 3

似乎異常來自服務器端。

無法將'java.lang.String'類型的值轉換為所需的'java.lang.Integer'類型； 嵌套的異常是java.lang.NumberFormatException：對於輸入字符串：“ null”

由於console.log(error.statusText);它正在控制台上打印console.log(error.statusText);

在API中使用該值時，您需要驗證邏輯。