javascript - 同一 Controller 上的 Angular 多个 ajax 调用有时不起作用

Question

我刚刚开始将 Angular 与 Ionic 结合使用，到目前为止，除了我的电子商务应用程序出现问题外，一切都很好，我正在执行两个 ajax 请求，一个用于加载 vendor 名称，另一个用于加载产品。我知道我可以将它放在同一个请求中，但出于其他原因需要将其分开。

有时会设置 vendor 名称，有时会失败。它似乎是完全随机的，如果我将调试器放在适当的位置，它总是可以工作，所以似乎与时间有关。

.controller('VendorProductsCtrl', function($scope, $stateParams, $http) {

  var vendor_name_url = 'URL FOR VENDOR NAME';

  $http.get(vendor_name_url)
    .success(function(response){
      $scope.vendor_name = response.meta.vendor_name;
      //debugger; this always works!
    })
    .error(function(data) {
      console.log('server error');
    })

  $scope.products = [];

  $scope.loadMore = function() {

    var url = 'URL FOR PRODUCTS';

    $http.get(url)
      .success(function(response){
        $scope.products = response.products;
      })
      .error(function(data) {
        console.log('server error');
      })
  };
})

在我对 Angular 领域的新探索中，似乎缺少一些基本的东西。感谢您的帮助。

P.S 我正在使用调用 loadMore() 的 Ionic 无限滚动

成功了，但似乎有点不可靠!

  setTimeout(function () {
    $scope.$apply(function () {
      $scope.vendor_name = response.meta.vendor_name;
    });
  }, 500);

我不热衷于等待 500 毫秒或任何它设置的时间，如果它更早准备好，有没有更好的方法？

Answer 1

使用$q.all

$q.all([
    $http.get(vendor_name_url),
    $http.get(url)
]).then(function(_responses){
    $scope.vendor_name = _responses[0].meta.vendor_name;
    $scope.products = _responses[1].products;
})