我正在尝试在另一个函数中使用此Google Maps for AngularJS指令。当我将$ scope.map移到函数调用之外并静态设置纬度/经度时，代码将起作用。但是，我想做的是在函数调用中动态设置纬度/经度。下面的代码。
的HTML：
<google-map center="map.center" zoom="map.zoom"></google-map>
角度控制器：
angular.module('StadiumCtrl', []).controller('StadiumController', function($scope, $rootScope, $routeParams, $sce, Stadia, Instagram, Weather) {
// pull stadium details from API based on routeParams
$scope.id = $routeParams.id;
Stadia.get($scope.id).success(function(response) {
$rootScope.logo = response.logo;
$scope.homeColors = {
"border": "2px solid " + response.sec_hex,
"box-shadow": "3px 3px 7px " + response.prim_hex,
"margin": "6px",
"padding": "0"
}
$scope.map = {
center: {
latitude: response.loc[1],
longitude: response.loc[0]
},
zoom: 8
};
// pass loc_id into Instagram API call
Instagram.get(response.loc_id).success(function(response) {
instagramSuccess(response.loc_id, response);
});
// pass city and state into Wunderground API call
Weather.get(response.city, response.state).success(function(response) {
$rootScope.temp = Math.round(response.current_observation.temp_f);
});
// Instagram API callback
var instagramSuccess = function(scope,res) {
if (res.meta.code !== 200) {
scope.error = res.meta.error_type + ' | ' + res.meta.error_message;
return;
}
if (res.data.length > 0) {
$scope.items = res.data;
} else {
scope.error = "This location has returned no results";
}
};
});
看起来，当google-maps指令被链接时，它需要一个初始值。一旦有了默认值，它将响应该范围值的更改。
您可以使用以下代码查看此操作：
$scope.map = {center: {latitude:0,longitude:0}, zoom: 0};
$timeout(function() {
$scope.map = {center: {latitude: 51.219053, longitude: 4.404418 }, zoom: 14 };
}, 1000);
在http://plnkr.co/edit/szhdpx2AFeDevnUQQVFe?p=preview中进行了演示。如果您在地图$scope.map外部将作业注释掉，$timeout地图将不再显示，但是如果您将第3行放回去，它将在$ timeout执行时更新地图。
就您而言，您应该只需能够添加
$scope.map = {
center: {
latitude: 0,
longitude: 0
},
zoom: 0
};
就在你跑步之前Stadia.get($scope.id).success(function(response) {。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句