在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應用程序的路線中創建一個承諾

回答

相關問題