角的foreach不等待服務器響應

Question

angular.forEach(tableName, function(value, key){ 
console.log("value ", value) 
getFormsService.getTableData(value).then(function(dynResponse){ 
    console.log("key",key," dynResponse", dynResponse.data) 
      }); 
}); 

在上述代碼表名包含表名陣列 例如：表名= [ 「表1」， 「表2」， 「表3」， 「tale4」]

每個表50，10，如圖5所示，20個記錄

我的輸出：

"value ", table1 
    "value ", table2 
    "value ", table3 
    "value ", table4 

    "key",2," dynResponse", array(5 records) 
    "key",1," dynResponse", array(10 records) 
    "key",3," dynResponse", array(20 records) 
    "key",0," dynResponse", array(50 records) 

預期輸出：

"value ", table1 
"key",0," dynResponse", array(50 records) 
"value ", table2 
"key",1," dynResponse", array(10 records) 
"value ", table3 
"key",2," dynResponse", array(5 records) 
"value ", table4 
"key",3," dynResponse", array(20 records) 


help me to get expected output 

Thanks 

Answer 1

angular.forEach(tableName, function(value, key){ 
    getFormsService.getTableData(value).then(function(dynResponse){ 
     console.log("value ", value) 
     console.log("key",key," dynResponse", dynResponse.data) 
    }); 
}); 

我不確定，你想要做什麼。爲了同步執行服務請求，您可以使用all()方法$q服務。

Answer 2

這裏getFormsService.getTableData回調是一個異步調用。因此，循環線程和服務線程不會鏈接在一起，而是將其他線程鏈接在一起。

// this line does not wait for service callback to be completed. 
angular.forEach(tableName, function(value, key){ 

    // this is an a asynchronous call 
getFormsService.getTableData(value).then(function(dynResponse){ 
    console.log("key",key," dynResponse", dynResponse.data) 
      }); 
}); 

可以更改服務打一個電話，或使用類似這樣

var inUse=false; 
    angular.forEach(tableName, function(value, key){ 

    while (!inUse) { 
     //waiting call might be costly you can try wait here as well 
     } 

    inUse=true; 
     // this is an a asynchronous call 
    getFormsService.getTableData(value).then(function(dynResponse){ 
       console.log("key",key," dynResponse", dynResponse.data) 
       inUse=false; 
       }); 
    }); 

Answer 3

JavaScript是始終同步和單線程。由於您正在調用服務代碼，所以不會等到獲得響應。它會執行代碼的其餘部分，並在收到響應時執行代碼的其餘部分。

從它可以進行Ajax調用等方面來說，JavaScript只是異步的。代碼將停止執​​行，直到調用返回（成功或以其他方式），此時回調將同步運行。

function FirstFunction(callback) { 
    angular.forEach(tableName, function(value, key){ 
     console.log("value ", value); 
    }); 
    callback(); 
} 

FirstFunction(function() { 
    getFormsService.getTableData(value).then(function(dynResponse){ 
     console.log("key",key," dynResponse", dynResponse.data) 
    }); 
});