返回inventoryData在promise值返回之前触发

Question

我有以下方法异步返回值。 return inventoryData似乎在填充其余值之前触发。这是日志：

我想等到在return inventoryData被触发之前检索所有值。我该怎么做？

function checkInventoryUrl(url, size, code) {
  var inventoryData = {};

  return $http.get(url).then(function(response) {
    var html = response.data;

    // returns value instantly
    inventoryData.url = url;

    // parses html, takes a few seconds to return value
    inventoryData.name = getProductName(html);
    inventoryData.price = getPrice(html);

    // returns promise
    getProductQty(html, size).then(function(result) {
      if(result) {
        inventoryData.qtyAvailable = result;
        console.log(inventoryData);
      }
    });

    // returns promise
    getProductMaxOrder(html, size).then(function(result) {
      if(result) {
        inventoryData.maxOrder = result;
        console.log(inventoryData);
      }
    });

    // returns promise
    getProductSize(html, size).then(function(result) {
      if(result) {
        inventoryData.size = result;
        console.log(inventoryData);
      }
    });

    // fired straight away returns empty object
    return inventoryData;
  });
}

Answer 1

JavaScript是单线程的。不能使功能“等待”。函数执行直到返回。它只能返回可用的值或挂起承诺，以便在数据从服务器返回时满足。

要为inventoryData创建承诺，请使用$q.all：

function checkInventoryUrl(url, size, code) {
  var inventoryData = {};

  return $http.get(url).then(function(response) {
    var html = response.data;

    // returns value instantly
    inventoryData.url = url;

    // parses html, takes a few seconds to return value
    inventoryData.name = getProductName(html);
    inventoryData.price = getPrice(html);

    // returns promise
    inventory.qtyAvailable = getProductQty(html, size);

    // returns promise
    inventoryData.maxOrder = getProductMaxOrder(html, size);

    // returns promise
    inventoryData.size = getProductSize(html, size);

    //RETURN composite promise
    return $q.all(inventoryData);
  });
}

$q.all方法接受一个对象，该对象可以承诺该对象的部分或全部属性。它返回一个承诺，该承诺通过第一个被拒绝的承诺的价值，以个人承诺或拒绝的所有已履行值履行。

使用：

 checkInventory(url, size, code).then(function (inventoryData) {
     console.log(inventoryData);
 }).catch(function(errorResponse) {
     throw errorResponse;
 }); 

Answer 2

这是设计，以及承诺如何运作。你需要将你的承诺链接到彼此（在thens中），然后你需要从最后一个返回inventoryData，或者只返回promise并继续使用它。

Answer 3

您可以使用{{3}}来获取一系列承诺，并且当所有已通过的承诺都已解决且能够调用#aboutus { padding-top: 90px; margin-top: -90px; } 方法调用时。

一个例子：

.then