在ajax調用時執行另一個功能的原因

Question

我正在一個項目中，其中有一個頁面有一個名為balance的輸入字段，並且包含此字段的div是balanceDiv。對於admin這個字段不會顯示。所以我使用ng-show來隱藏/顯示div，write功能在角度控制器（一個用於收集loginId的控制器，另一個用於根據該登錄ID進行隱藏或顯示div的控制器）。顯示或隱藏div的條件是--如果admin被發現（id 1）div將隱藏，否則div將顯示。這樣做我注意到在調用ajax時-執行切換到第二個函數。在我的角度控制器中-

        init();
        function init()
        {
            setLoginId();
            showHide();
            initilize();
        }

您可以看到它首先將執行setLoginId，然后將其用於showHide（正如我期望的那樣）。這兩個功能-

    function setLoginId()
    {
        var apiRoute = baseUrl + '/api/AmountDists/GetLoginId/';
        var result = CrudService.getAll(apiRoute);
        result.then(function (response) {
            debugger
            $scope.loginId = response.data;


        },
        function (error) {
            console.log("Error: " + error);
        });
    }
    function showHide() {
        if ($scope.loginId == 1) {
            $scope.balanceDiv = false;
        }
        else {
            $scope.balanceDiv = true;
        }
    }

我注意到的是，當它之后在setLoginId方法中執行ajax調用而又沒有得到響應（或完成該方法）時，它會進入showHide方法。完成showHide方法后，它將再次返回setLoginId方法。然后它將執行其余操作結果是我正在showHide方法中獲得$ scope.loginId的未定義值。

我想知道為什么會這樣嗎？ 為什么在ajax調用時執行切換到另一種方法？

Answer 1

這些功能需要鏈接 ：

    init();
    function init()
    {
        setLoginId().then(function(data) { 
            showHide(data);
        }).then(function () {
            initilize();
        });
    }

一定要返回對鏈接的承諾：

function setLoginId()
{
    var apiRoute = baseUrl + '/api/AmountDists/GetLoginId/';
    var promise = CrudService.getAll(apiRoute);
    return promise.then(function (response) {
  //^^^^^^  return derived promise
        debugger
        $scope.loginId = response.data;
        //RETURN data to chain
        return response.data;
    },
    function (error) {
        console.log("Error: " + error);
    });
}

添加數據參數：

function showHide(loginID) {
    if (loginID == 1) {
        $scope.balanceDiv = false;
    }
    else {
        $scope.balanceDiv = true;
    }
}

通過返回promise，並使用promise的.then方法，第二個函數的執行將延遲到第一個XHR完成。

---

我想知道原因

重要的是要意識到$http服務會立即返回未兌現的Promise ，並並行生成異步xmlHttpRequest（XHR） 。 結果從服務器返回時，以后會兌現（解決或拒絕）promise。

異步API調用之后的代碼將立即執行。 如果需要將代碼延遲到XHR完成之前，則需要將其作為函數提供給promise的.then方法。

有關更多信息，請參見：

• AngularJS $ q服務API參考-鏈式承諾
• JavaScript承諾/ A +規范