在过去的几个小时里,我一直在努力解决以下问题,我不知道如何解决它。我正在制作一个使用angular-openlayers-directive指令的角度应用程序。 $ scope.center对象包含最初在地图上查看的位置。以下代码是查看地图的页面控制器的第一行。这一切都运作良好。
angular.extend($scope, {
center: {
lat: 0,
lon: 0,
zoom: 1,
autodiscover: true
},
layers: {
normal: {
type: 'Tile',
source: {
type: 'OSM'
}
}
}
});
但是,现在我尝试使用从Google地理编码API获取的位置来更新中心对象。单击google api结果的一行会在控制器中调用以下函数:
$scope.gotoLocation = function(lat, lon) {
$log.log("called");
$scope.center = {
lat: 50,
lon: 50,
zoom: 0
}
}
在我的控制台中,字符串日志"称为"出现,但地图视图不会改变。此外,当我在函数中打印$ scope.center时,将打印上面设置的原始对象,而此对象已更改为我当前的lat和lon,因为autodiscover选项设置为true。我用以下代码检查了这个:
<openlayers ol-controls="controls" ol-center="center" ol-layers="layers" ol-markers="markers">
<ol-marker ng-repeat="marker in markers" lat="marker.lat" lon="marker.lon"></ol-marker>
</openlayers>
<form>
Latitude : <input type="number" step="any" ng-model="center.lat" />
Longitude : <input type="number" step="any" ng-model="center.lon" />
Zoom : <input type="number" step="any" ng-model="center.zoom" />
</form>
所有3个字段显示我当前的lat和lon,当我更改字段时,地图位置会更新(!)。我不知道为什么从模板本身更改模型确实有效并且从控制器更改模型不起作用。任何人都可以帮我这个吗?
答案 0 :(得分:0)
您的自动发现变量似乎已被删除。这与自动更新有关吗?
尝试更改gotoLocation函数以更新属性,而不是覆盖对象:
$scope.gotoLocation = function(lat, lon) {
$log.log("called");
$scope.center.lat = 50;
$scope.center.lon = 50;
$scope.center.zoom = 0;
}
答案 1 :(得分:0)
它与不同的范围有关。我的地图视图是使用ng-view包含的。我的搜索栏包含使用ng-include,因此它们具有不同的范围。我用工厂解决了。