我目前正在开发Angular应用,但是我很难用resolve
实现诺言。我要完成的工作如下:
获取用户地理位置
使用用户地理位置作为参数来调用SongKick
从API调用成功接收到数据后,我希望home.html
页面加载在q.resolve
中找到的数据
所有人都希望所有这些都能有序发生。本质上,在显示主页之前,我需要获取一些数据。问题是,当我在getLocation
中控制台登录homeCtrl
时,它是未定义的。有谁知道为什么或有更好的方法来处理这种事情?
FYI:assignValues
是定义了地理位置值后的成功回调。
routes.js
angular.module('APP', ['ui.router',
'APP.home',
'uiGmapgoogle-maps'
])
.config(function($urlRouterProvider, $stateProvider, uiGmapGoogleMapApiProvider) {
$stateProvider.state("home", {
url:"/",
templateUrl: '/home.html',
controller: 'homeCtrl',
resolve: {
getLocation: function(dataFactory, $q){
var q = $q.defer();
navigator.geolocation.getCurrentPosition(assignValues);
function assignValues(position) {
dataFactory.getMetroArea(position.coords.latitude, position.coords.longitude).then(function(data){
q.resolve(data);
return q.promise;
})
}
}
}
})
HomeCtrl.js
angular.module('APP.home',['APP.factory'])
.controller('homeCtrl', ['$rootScope', '$scope', '$http', '$location', 'dataFactory', 'artists','uiGmapGoogleMapApi', 'getLocation', homeCtrl])
function homeCtrl($rootScope, $scope, $http, $location, dataFactory, artists, uiGmapGoogleMapApi, getLocation){
$scope.googleMapsData = getLocation
}
dataFactory.js(省去了工厂的其余部分)
dataFactory.getMetroArea = function(lat, lon){
return $http.get('http://api.songkick.com/api/3.0/search/locations.json?location=geo:'+ lat + ',' + lon + '&apikey=APIKEY')
}
最佳答案
解析方法需要返回承诺或实际数据。这是一种清理解决方法,其中包括拒绝(您不想让请求挂起)。
angular.module('APP', ['ui.router', 'APP.home', 'uiGmapgoogle-maps'])
.config(function($urlRouterProvider, $stateProvider, uiGmapGoogleMapApiProvider) {
$stateProvider.state("home", {
url: "/",
templateUrl: '/home.html',
controller: 'homeCtrl',
resolve: {
getLocation: function(dataFactory,$q) {
var q = $q.defer();
navigator.geolocation.getCurrentPosition(function(position){
dataFactory.getMetroArea(position.coords.latitude, position.coords.longitude).then(function(data){
q.resolve(data);
},function(err){
q.reject(err);
})
},function(err){
q.reject(err);
});
return q.promise;
}
}
});
});
关于javascript - 在Angular应用的路由解决方案中创建 promise ,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/33206044/