在angularjs中的控制器内部调用multipe$http
multipe $http calls inside a controller in angularjs
我正在尝试在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) {
});
因为您没有从任何地方调用$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;
};
我看到$scope.searchid
从未被调用,请尝试调用$scope.searchid()
来启动第二个api
调用。
相关文章:
- 如何使jQuery插件函数可调用以供独立使用,而不在集合上操作
- D3在一个调用中绘制不同的SVG形状,没有可见性
- 如何从Java/scala调用js美化程序
- 如何调用这个匿名 JavaScript 函数
- 如何从模块链中调用函数.导出到节点中
- 我需要从php调用javascript或jquery
- Chrome开发工具(如何知道我在调用哪个javascript对象)
- 单击按钮后如何逐个调用分区,上一个分区将隐藏
- 另一个ajax调用中的Jquery ajax调用在for循环中没有按预期工作
- Twitter Bootstrap typeahead:使用“this”获取上下文/调用元素
- node.js:setInterval()正在跳过调用
- 如何在单击复选框后调用控制器方法
- 如何在JQuery函数中定义一个值,然后调用另一个函数并使用该值
- 使用Google Visualization动态调用构造函数
- 如何在webView,Android中从@JavascriptInterface方法调用Javascript
- 是否可以将一个函数输入连接到另一个函数调用的文本
- 调用函数内部的函数
- 函数未在Object.keys或Object.getOwnPropertyNames下列出,但可以调用
- Javascript/jQuery中的并行Ajax调用
- 在angularjs中的控制器内部调用multipe$http