AngularJS 等待单个异步调用

Question

我正在尝试将一些数据放在异步调用返回的范围内。
我在工厂里有一个数组叫做公司。

factory.getByCategoryId = function (id) {
  $http.get('http://localhost/campaign?access-token=12345&id=2').then(
    function (result) {
      factory.companies = [];
      if (result.data.length !== 0) {
        for (var index = 0; index < result.data.length; index++) {
          factory.companies.push(result.data[index]);
       }
      } else {
        console.log('Result is not set.', result);
      }
    },
    function (result) {
      console.log('Failed', result);
    }
  );
}

调用函数：

$scope.closeModal = function (index) {
  if (index) {
    var promises = []

    promises.push(Service.getByCategoryId($scope.categories[index].id));

    $q.all(promises).then(function () {
      $scope.myItems = Service.all(); //return all from factory.companies

      $scope.refreshItems(); //this function refreshes the DOM using myItems
    });
  }
}

第一次调用这个函数 factory.companies 保持不变，但在第二次调用后它更新了。我确定该应用程序应该以某种方式等待更多，但不知道如何。

Answer 1

我只会从您的服务返回$http

在您的工厂：

factory.getByCategoryId = function (id) {
    return $http.get('http://localhost/campaign?access-token=12345&id=2');
}

还有你的功能

$scope.closeModal = function (index) {
    Service.getByCategoryId($scope.categories[index].id).then(
    function (result) {
        if (result.data.length) {
            angular.forEach(result.data, function(value) {
                $scope.myItems.push(value);
            });
            $scope.refreshItems();
        } else {
            console.log('Result is not set.', result);
        }
    },
    function (result) {
      console.log('Failed', result);
    }
};

或者你可以重写你的服务函数来解决一个承诺：

factory.getByCategoryId = function (id) {
    return $q(function (resolve, reject) {
        $http.get('http://localhost/campaign?access-token=12345&id=2').then(
            function (result) {
                factory.companies = [];
                if (result.data.length !== 0) {
                    for (var index = 0; index < result.data.length; index++) {
                        factory.companies.push(result.data[index]);
                    }
                    resolve(factory.companies);
                } else {
                    reject('Result is not set.', result);
                }
            },
            function (result) {
                console.log('Failed', result);
            }
        );
    });
}

并将其用作

$scope.closeModal = function (index) {
    Service.getByCategoryId($scope.categories[index].id).then(function(result) {
    $scope.myItems = result;
    $scope.refreshItems();
}, function(result) {
    console.log(result);
});

Answer 2

如果

Service.getByCategoryId($scope.categories[index].id)

然后返回一个承诺

$scope.closeModal = function (index) {
if (index) {
    Service.getByCategoryId($scope.categories[index].id).then(function (res) {
        $scope.myItems = Service.all(); //return all from factory.companies
        $scope.refreshItems(); //this function refreshes the DOM using myItems
    }, function (res) {
        // Error Handling
    })
 }
}

供参考::

app.factory('Service', function ($http) {
return {
    // Below function retuns a promsie
    getByCategoryId_promise: function () {
        // This simply sends the promise but you need to make it execute using $q 
        //or by entending like the closeModal method above
        return $http.get("URL GOES HERE");
    },
    // Below function retuns results from a promise
    getByCategoryId: function () {
        // This Function waits till the HTTP call is resolved and then sends the result
        return $http.get("URL GOES HERE").then(function (res) { }, function (res) { })
    },
}
})

Answer 3

    promises.push(Service.getByCategoryId($scope.categories[index].id));

所以你把Service.getByCategoryId和push的返回值变成promises。

Service.getByCategoryId的返回值是多少？

它没有return 语句，所以它是undefined。

你需要修改Service.getByCategoryId，让它返回一个promise（大概是$http.get的返回值）。