我正在尝试在 google maps map 中移动标记。我有移动它们的功能,它们工作正常。为了进行测试,我在脚本中调用了它们,它们按预期工作。
但是当我试图在 ng-click 指令中调用该函数时,该函数被调用但整个代码没有被执行。
<md-button class="md-raised md-primary" ng-click="x()">Click here to move the marker</md-button>
方法:
$scope.x = function ()
{
console.log('a');
$scope.marker = {
id: 6,
coords: {latitude:-28.226349,longitude:-52.381581}
};
}
在控制台内,正在打印“a”,但标记不会移动到纬度:-28.226349,经度:-52.381581。
如果我像这样在脚本中调用函数:
$scope.x = function ()
{
console.log('a');
$scope.marker = {
id: 6,
coords: {latitude:-28.226349,longitude:-52.381581}
};
}
$scope.x();
加载页面时,标记位于纬度:-28.226349,经度:-52.381581。
整个 HTML:
<md-button class="md-raised md-primary" ng-click="x()">Click here to move the marker</md-button>
<div id="map" ng-controller="MapCtrl">
<ui-gmap-google-map center='map.center' zoom='map.zoom' options="map.options">
<ui-gmap-marker coords="marker.coords" options="marker.options" events="marker.events" idkey="6"></ui-gmap-marker>
</ui-gmap-google-map>
最佳答案
看看这个codepen here .
它按预期工作。我认为问题出在您的 idkey 上。使 idkey 动态化并将其绑定(bind)到标记对象的 ID。
HTML
<div ng-app="myApp" ng-controller="gMap">
<md-button class="md-raised md-primary" ng-click="x()">Marker</md-button>
<ui-gmap-google-map
center='map.center'
zoom='map.zoom' aria-label="Google map">
<ui-gmap-marker
coords="marker.coords" options="marker.options" events="marker.events" idkey="marker.id">
<ui-gmap-window>
<div>{{marker.window.title}}</div>
</ui-gmap-window>
</ui-gmap-marker>
</ui-gmap-google-map>
</div>
Controller
myApp.controller("gMap", function($scope) {
$scope.x = function() {
console.log('a');
$scope.marker = {
id: 6,
"coords": {
"latitude": "40.7903",
"longitude": "-73.9597"
}
}
}
$scope.marker = {
id: 6,
"coords": {
"latitude": "45.5200",
"longitude": "-122.6819"
}
}
$scope.map = {
center: {
latitude: 39.8282,
longitude: -98.5795
},
zoom: 4
};
});
关于javascript - ng-click 指令没有调用整个函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37028638/