AngularJS等待单个异步调用

时间:2016-06-16 12:25:14

标签: javascript angularjs asynchronous ionic-framework q

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

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保持不变,但在第二次调用后更新。我确定应用程序应该等待更多,但不知道如何。

3 个答案:

答案 0 :(得分: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);
});

答案 1 :(得分:1)

如果

  

Service.getByCategoryId($ scope.categories [指数] .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) { })
    },
}
})

答案 2 :(得分:0)

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

因此,您将Service.getByCategoryIdpush的返回值转换为promises

Service.getByCategoryId的返回值是什么?

它没有return语句,因此它是undefined

您需要修改Service.getByCategoryId,以便它返回一个承诺(可能是$http.get的返回值)。