我遇到了角度谷歌地图和搜索框的问题。 即使ng-view onLoad按预期工作,在搜索框中输入后,也不会从正确的控制器调用places_changed回调,而是仅从$ routeProvider中定义的第一个(和默认值)调用。
您可以在下面找到更多详细信息:
模板的一部分:
<div ng-controller="map">
<div>
<script type="text/ng-template" id="searchbox.tpl.html">
<input type="text" placeholder="Search Place..." class="google-maps-search">
</script>
<ui-gmap-google-map center='map.center' events="map.events" options="map.options" zoom='map.zoom'>
<ui-gmap-search-box template="map.searchbox.template" events="map.searchbox.events" position="BOTTOM_RIGHT"></ui-gmap-search-box>
<ui-gmap-marker coords="map.marker.coords" options="map.marker.options" events="map.marker.events" idkey="map.marker.id"></ui-gmap-marker>
<ui-gmap-markers models="mapMarkers" coords="'self'" icon="'icon'">
<ui-gmap-windows show="show">
<div ng-non-bindable>{{title}}</div>
</ui-gmap-windows>
</ui-gmap-markers>
</ui-gmap-google-map>
</div>
<div><div ng-view="" onload="renderView()"></div></div>
父控制器的一部分:
app.controller('map', function ($scope, $log, $location) {
$scope.map = {
events: {
click: function(map, eventName, args) {}
},
marker: {
id: 0,
coords: {
latitude: $scope.lat,
longitude: $scope.lng
},
options: { draggable: true }
},
searchbox: {
template: 'searchbox.tpl.html',
events: {
places_changed: function (searchBox) {}
}
}
};
});
以下每个子控制器(在$ routeProvider中定义):
$scope.map.searchbox.events.places_changed = function (searchBox) {
var place = searchBox.getPlaces();
if (!place || place == 'undefined' || place.length == 0) {
console.log('no place data :(');
return;
}
$scope.lat = place[0].geometry.location.lat();
$scope.lng = place[0].geometry.location.lng();
$scope.map.center = {
"latitude": $scope.lat,
"longitude": $scope.lng
};
$scope.renderView();
};
你有什么想法吗?