Question

我正在尝试在angularJS中实现wego API。我面临的问题是，要获得酒店列表，我需要进行三次API调用，每次调用的结果都会提供一些信息，这些信息需要传递给下一个API调用。我面临的问题是，我能够成功进行第一次通话，但不能继续进行。我尝试使用console.log并发现在进行第二次API调用后，执行既不会进入成功回调，也不会进入错误回调。这是我的代码： -

var app = angular.module('tripochill', []);

app.controller('MainCtrl', function($scope, $http, $log) {

  $scope.city = "";
  $scope.ts_code = #####;
  $scope.key = ##########;

  $("#from").on("change", function() {
    $scope.checkin = $(this).val();
    console.log($scope.checkin);

    chk = $scope.checkin;
    day = chk.substr(0, 2);
    mon = chk.substr(3, 2);
    yr = chk.substr(6);
    $scope.checkin = (yr + "-" + day + "-" + mon);

    console.log($scope.checkin);
  });


  $("#to").on("change", function() {
    $scope.checkout = $(this).val();
    console.log($scope.checkout);

    chk = $scope.checkout;
    day = chk.substr(0, 2);
    mon = chk.substr(3, 2);
    yr = chk.substr(6);
    $scope.checkout = (yr + "-" + day + "-" + mon);

    console.log($scope.checkout);
  });

  console.log($scope.city[0]);

  $scope.cityNames = function() {
    $http.get("http://api.wego.com/hotels/api/locations/search?q=" + $scope.city[0] + "&ts_code=" + $scope.ts_code + "&key=" + $scope.key)
      .then(onSuccessName, onErrorName);
  };
  //Success method
  var onSuccessName = function(response) {
    $scope.count = response.data.count;
    console.log($scope.count);
    var count = 0;
    for (var i = 0; i < $scope.count; i++) {
      if (response.data.country_name == city[2]) {
        count = i;
        break;
      }
    }
    console.log(count);
    console.log(response.data.locations[count].id);
    id = response.data.locations[count];
    $scope.id = id.id;

    $scope.searchid = function() {
      console.log("hahahahaha");
      $http.get("http://api.wego.com/hotels/api/search/new?location_id=" + $scope.id + "&check_in=" + $scope.checkin + "&check_out=" + $scope.checkout + "&user_ip=direct&ts_code=" + $scope.ts_code + "&key=" + $scope.key)
        .then(onSuccessSearch, onErrorSearch);
    };
    var onSuccessSearch = function(response) {
      console.log("2");
      console.log(response.data);
      $scope.search_id = response.data;
    };
    var onErrorSearch = function(response) {
      console.log("here!!!");
      $log.info(response);
      $scope.info = "Could not retrieve data";
    };
  };
  //Error method

  var onErrorName = function(response) {
    $log.info(response);
    $scope.info = "Could not retrieve data";
  };

  /*function hotels(search_id){
    $scope.hotelList = function () {
          $http.get("http://api.wego.com/hotels/api/search/"+search_id+"&ts_code="
              +$scope.ts_code+"&key="+$scope.key)
        .then(onSuccessList, onErrorList);
      };
      var onSuccessList = function (response) {
          $scope.hotels = response.data;
          console.log($scope.hotels);
      };
      var onErrorList = function (response) {
          $log.info(response);
          $scope.info = "Could not retrieve data";
      };
  }*/
});

app.controller('SecondCtrl', function($scope) {

});

Answer 1

我发现永远不会调用$scope.searchid，请尝试拨打$scope.searchid()以启动第二次api来电。

Answer 2

因为您没有从任何地方拨打$scope.searchid。所以你需要把它叫做

$scope.searchid = function () {
   console.log("hahahahaha");
   $http.get("http://api.wego.com/hotels/api/search/new?location_id="+$scope.id+"&check_in="
                +$scope.checkin+"&check_out="+$scope.checkout+"&user_ip=direct&ts_code="+$scope.ts_code
                +"&key="+$scope.key)
        .then(onSuccessSearch, onErrorSearch);
};

$scope.searchid(); // add this line in your code

var onSuccessSearch = function (response) {
     console.log("2");
     console.log(response.data);
     $scope.search_id = response.data;
};

在angularjs中的控制器内的multipe $ http调用

2 个答案: