在AngularJS中按顺序运行$ http请求 [英] Running $http requests sequentially in AngularJS

问题描述

我的 $ scope 上有一系列项目。对于每个项目，我需要运行三个$ http请求。无论是否存在失败，这些请求必须按特定顺序运行。我不确定如何优雅地做到这一点，有了承诺的范例。我有很多重复的代码，看起来真的很混乱。我必须做错了。目前，我有以下内容：

I have an array of items on my $scope. For each of those items, I need to run three $http requests. These requests must run in a specific order, no matter whether there was a failure of not. I'm not sure how to do this elegantly, with the promise paradigm. I have a lot of duplicate code and it looks really confusing. I have to be doing this wrong. Currently, I have the following:

$scope.items = getItems();
$scope.currentIndex = 0;

$scope.executeItem = function() {
  $http.get($scope.items[$scope.currentIndex].urlA).then(
    function (resA) {
      $scope.items[$scope.currentIndex].urlAWorks = true;
      $http.get($scope.items[$scope.currentIndex].urlB).then(
        function (resB) {
          $scope.items[$scope.currentIndex].urlBWorks = true;

          $http.get($scope.items[$scope.currentIndex].urlC).then(
            function (resC) {
              $scope.items[$scope.currentIndex].urlCWorks = true;
              $scope.currentIndex = $scope.currentIndex + 1;
              $scope.executeItem();
            },

            function (errC) {
              $scope.items[$scope.currentIndex].urlCWorks = false;
              $scope.currentIndex = $scope.currentIndex + 1;
              $scope.executeItem();
            }
          )
        },
        function (errB) {
          $scope.items[$scope.currentIndex].urlBWorks = false;
        }
      );
    },

    function (errA) {
      $scope.items[$scope.currentIndex].urlAWorks = false;
      $http.get($scope.items[$scope.currentIndex].urlB).then(
        function (resB) {
          $scope.items[$scope.currentIndex].urlBWorks = true;

          $http.get($scope.items[$scope.currentIndex].urlC).then(
            function (resC) {
              $scope.items[$scope.currentIndex].urlCWorks = true;
              $scope.currentIndex = $scope.currentIndex + 1;
              $scope.executeItem();
            },

            function (errC) {
              $scope.items[$scope.currentIndex].urlCWorks = false;
              $scope.currentIndex = $scope.currentIndex + 1;
              $scope.executeItem();
            }
          )
        },
        function (errB) {
          $scope.items[$scope.currentIndex].urlBWorks = false;
        }
      );
    }
  );
};

我是否真的在正确地链接承诺？这看起来很开心。

Am I really chaining promises correctly? This looks WAY off.

谢谢

推荐答案

你的使用不足承诺:)由于 .then 返回承诺，你可以这样做：

You are underusing promises :) Since .then returns a promise, you could do:

$http.get(urlA)
  .then(function(dataA){
    DoStuffWithA(dataA);

    return $http.get(urlB);
  })
  .then(function(dataB){
    DoStuffWithB(dataB);

    return $http.get(urlC);
  })
  .then(function(dataC){
    DoStuffWithC(dataC);

    return true;
  })

这篇关于在AngularJS中按顺序运行$ http请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！