请问,为什么我无法访问 $http
方法之外的 $scope.auditorium
但我可以访问其他 $http
(例如 $scope.exhibition
)在另一个 $http ($scope.auditorium)
中。通过 $scope.combine
代码:
myApp.controller('displayCatController', ['$scope','$http', function($scope, $http){
//Display auditoriums information
$http({
method: 'GET',
url:'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=auditoriums&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4Mzc5ODU3LCJleHAiOjE1Mzg4MTE4NTcsIm5iZiI6MTUzODM3OTg1NywianRpIjoiMmUxZDI2NzM0YjkxYzg2N2Y4NDdkZjI1ZTVhMzQyMjgifQ.HUmGwWO7E1MJpFADcuQyVA0h6bR2Vkkp0BQrTfrEj0k'
}).then(function successCallback(response) {
$scope.auditoriums = response.data.SrchResults;
}, function errorCallback(response) {
console.log(response);
});
//Display exhibitions information
$http({
method: 'GET',
url: 'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=exhibitioncentres&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4Mzc5ODU3LCJleHAiOjE1Mzg4MTE4NTcsIm5iZiI6MTUzODM3OTg1NywianRpIjoiMmUxZDI2NzM0YjkxYzg2N2Y4NDdkZjI1ZTVhMzQyMjgifQ.HUmGwWO7E1MJpFADcuQyVA0h6bR2Vkkp0BQrTfrEj0k'
}).then(function successCallback(response) {
$scope.exhibitions = response.data.SrchResults;
$scope.exhibitions.splice(0,1);
}, function errorCallback(response) {
console.log(response);
});
$scope.combine = $scope.exhibitions.concat($scope.auditoriums, $scope.hotels);
console.log($scope.combine);
}]);
我无法访问 $scope.combine,它什么也不显示。但另一方面,如果我将 $scope 放在 $http 内,示例如下:
myApp.controller('displayCatController', ['$scope','$http', function($scope, $http){
//Display auditoriums information
$http({
method: 'GET',
url:'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=auditoriums&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4Mzc5ODU3LCJleHAiOjE1Mzg4MTE4NTcsIm5iZiI6MTUzODM3OTg1NywianRpIjoiMmUxZDI2NzM0YjkxYzg2N2Y4NDdkZjI1ZTVhMzQyMjgifQ.HUmGwWO7E1MJpFADcuQyVA0h6bR2Vkkp0BQrTfrEj0k'
}).then(function successCallback(response) {
$scope.auditoriums = response.data.SrchResults;
}, function errorCallback(response) {
console.log(response);
});
//Display exhibitions information
$http({
method: 'GET',
url: 'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=exhibitioncentres&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4Mzc5ODU3LCJleHAiOjE1Mzg4MTE4NTcsIm5iZiI6MTUzODM3OTg1NywianRpIjoiMmUxZDI2NzM0YjkxYzg2N2Y4NDdkZjI1ZTVhMzQyMjgifQ.HUmGwWO7E1MJpFADcuQyVA0h6bR2Vkkp0BQrTfrEj0k'
}).then(function successCallback(response) {
$scope.exhibitions = response.data.SrchResults;
$scope.exhibitions.splice(0,1);
$scope.combine = $scope.exhibitions.concat($scope.auditoriums, $scope.hotels);
console.log($scope.combine);
}, function errorCallback(response) {
console.log(response);
});
}]);
如果问题很愚蠢,请原谅我,我对 AngularJS 还很陌生。感谢您的帮助!
最佳答案
$http
服务将异步运行,而您的 $scope.combine
声明将同步运行并在异步操作完成之前进行设置。这就是为什么这些值是空的。
解决此问题的一个选择是等待所有异步操作完成。
这是一个例子
myApp.controller('displayCatController', ['$scope','$http','$q', function($scope, $http, $q){
//Display auditoriums information
var promise1 = $http({
method: 'GET',
url:'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=auditoriums&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4Mzc5ODU3LCJleHAiOjE1Mzg4MTE4NTcsIm5iZiI6MTUzODM3OTg1NywianRpIjoiMmUxZDI2NzM0YjkxYzg2N2Y4NDdkZjI1ZTVhMzQyMjgifQ.HUmGwWO7E1MJpFADcuQyVA0h6bR2Vkkp0BQrTfrEj0k'
}).then(function successCallback(response) {
$scope.auditoriums = response.data.SrchResults;
}, function errorCallback(response) {
console.log(response);
});
//Display exhibitions information
var promise2 =$http({
method: 'GET',
url: 'https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=exhibitioncentres&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM4Mzc5ODU3LCJleHAiOjE1Mzg4MTE4NTcsIm5iZiI6MTUzODM3OTg1NywianRpIjoiMmUxZDI2NzM0YjkxYzg2N2Y4NDdkZjI1ZTVhMzQyMjgifQ.HUmGwWO7E1MJpFADcuQyVA0h6bR2Vkkp0BQrTfrEj0k'
}).then(function successCallback(response) {
$scope.exhibitions = response.data.SrchResults;
$scope.exhibitions.splice(0,1);
}, function errorCallback(response) {
console.log(response);
});
$q.all([promise1, promise2]).then(function(){
$scope.combine = $scope.exhibitions.concat($scope.auditoriums, $scope.hotels);
console.log($scope.combine);
});
}]);
关于javascript - AngularJS 访问 $http 之外,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52658979/