初始请求网址为http://localhost/#/map?lat=33.73060000952102&lng=-117.12635126323244
在我的项目中,我正在使用谷歌地图自动完成服务,该服务使用地址预测自动填充文本字段,并在选择地址时,地图以该位置为中心。我的place_changed事件监听器被成功触发,我的控制器setLocation函数被成功调用。但是,地址栏中的URL未使用新的lat和lng参数值更新。
如果我从html中的ng-click调用$ scope.getProjectsByCenter()它可以工作。不知何故,place_changed中的事件链与$ location.search冲突。
任何人都有任何想法为什么?
angular:app.js
var app = angular.module('projectmapsApp', []);
app.controller('MainMapController', function($scope,$location){
$scope.setLocation = function(lat,lng){
$location.search('lat',lat);
$location.search('lng',lng);
console.log($location.search()); //This logs an object with the new lat and lng
};
$scope.getProjectsByCenter = function(){
var center = getProjectsByCenter();
$scope.setLocation(center.lat(),center.lng());
};
});
vanilla:map.js
function initializeMap() {
var map = new google.maps.Map(document.getElementById("map-canvas"), {
center: {lat: 33.868670, lng: -117.796783}
});
var input = document.getElementById('place-search');
var autocomplete = new google.maps.places.Autocomplete(input);
autocomplete.addListener('place_changed', function() {
var place = autocomplete.getPlace();
if (!place.geometry) {
return;
}
var lat = place.geometry.location.lat();
var lng = place.geometry.location.lng();
angular.element('#MainMapController').scope().setLocation(lat,lng);
};
};
答案 0 :(得分:1)
找到答案。 $申请()
我的setLocation现在看起来像这样:
$scope.setLocation = function(lat,lng){
$location.search('lat',lat);
$location.search('lng',lng);
$scope.$apply();
};
这篇好文章:http://jimhoskins.com/2012/12/17/angularjs-and-apply.html