angularjs - (angularjs-google-maps) ng-click 内部标记

Question

这个问题是关于angularjs-google-maps的，https://github.com/allenhwkim/angularjs-google-maps

有没有办法在标记上使用 ng-click 来设置这样的变量？ (为了测试目的，1 的值是硬编码的)。当前点击标记似乎不会触发 ng-click。

<marker ng-repeat="instance in common.instances" 
 position="[{{instance.lat}},{{instance.lng}}]" 
 ng-click="common.selectedinstance = 1">
</marker>

Answer 1

来自他们的文档，https://developers.google.com/maps/documentation/javascript/events ,

User events (such as "click" mouse events) are propagated from the DOM to the Google Maps API. These events are separate and distinct from standard DOM events.

据我了解，只有谷歌地图事件可以应用于谷歌地图对象，包括标记、形状等。

这是个坏消息。

好消息是您仍然可以使用 on-click 事件来操作 $scope 变量和事件。只要你为这个事件使用一个函数，就没有太大的区别。

我会继续调查是否有解决方法，以便我们可以使用 AngularJS 事件(即 ngMouseenger、ngMouseleave、ngMouseup、ngClick 等)

在 plunkr 上有一个使用 on-click 的工作示例可以满足您的要求。

http://plnkr.co/edit/6qvS0vUYkqVHZ3t6qmn2?p=preview

这是脚本部分

  $scope.myVar = 1;
  $scope.changeMyVar = function(event) {
    $scope.myVar+=1;
    $scope.$apply();
  }

这是html部分

  <map zoom="11" center="[40.74, -74.18]">
    <marker ng-repeat="p in positions" 
      position="{{p}}" title="{{p.toString()}}"
      on-click="changeMyVar()">
    </marker>
  </map>
  myVar : {{myVar}}  Click a marker to increase myVar

要了解有关 angularjs-google-maps 事件的更多信息，请查看 the example about event