在Angular应用程序的路线中创建一个承诺

我目前正在开发一个Angular应用程序，但我很难实现与resolve的承诺。我想做到的是在以下几点：在Angular应用程序的路线中创建一个承诺

获取一个用户的地理位置
使用用户的地理位置作为参数的API调用来Songkick的
数据已经从API调用接收成功后，我想要home.html页面加载在q.resolveq.resolve

所有这些想要发生的顺序。基本上，在显示我的主页之前我需要获取数据。问题是，当我在我的homeCtrl控制台日志getLocation它是未定义的。任何人都知道为什么或有更好的方法来处理这种事情？

供参考：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') 
    }

来源

2015-10-19 theamateurdataanalyst

解析方法需要返回承诺或实际数据。这是一个清理解决方法，其中包括拒绝（你不想挂掉你的请求）。

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; 
     } 
     } 
    }); 
    });

来源

2015-10-19 03:23:46

其中'dataFactory.getMetroArea'从 –

获得位置'哦，哇，完全忘了'getCurrentPosition'是异步的。相应地编辑我的答案。 –

我认为你的getLocation函数应该是

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; 
}

来源

2015-10-19 03:19:56

谢谢！看起来像我的'q.promise'需要住在getLocation的本地范围内吗？ – theamateurdataanalyst

在Angular应用程序的路线中创建一个承诺

回答

相关问题