无法使用angular-google-maps中的markers标记打开标记窗口

时间:2014-08-21 08:32:03

标签: angularjs angular-google-maps

目标 在地图上显示一堆随机标记。单击其中一个时打开信息窗口。 我使用了API页面(标记)中的一个示例,并添加了窗口的标记和单击处理程序方法来显示窗口。但我无法让它工作

问题 显示标记,但单击时不显示任何窗口。

除了 我在使用tag和ng-repeat时有这个工作;但文档说标签是首选方法。

有什么想法吗?

此处示例:https://angular-ui.github.io/angular-google-maps/#!/api

在这里插入:http://plnkr.co/edit/ze7EKMQNV7MLGkmlhiAC

  <div id="map_canvas" ng-controller="mainCtrl">
    <google-map center="map.center" zoom="map.zoom" draggable="true" options="options" bounds="map.bounds">
      <markers models="randomMarkers" coords="'self'" icon="'icon'" click="'onClicked'">
        <window ng-cloak show="'showWindow'">
          <h1>{{title}}!</h1>
        </window>
      </markers>
    </google-map>
  </div>

 $scope.$watch(function() {
      return $scope.map.bounds;
    }, function(nv, ov) {
      // Only need to regenerate once
      if (!ov.southwest && nv.southwest) {
        var markers = [];
        for (var i = 0; i < 5; i++) {
          markers.push(createRandomMarker(i, $scope.map.bounds))
        }
        for (var y = 0; y < 5; y++) {
          var marker = markers[y];
          marker.onClicked = function() {
            marker.showWindow = true;
          }
        }

        $scope.randomMarkers = markers;
      }
    }, true);

解决 这是使用nitewulf50链接的插件解决的。

一些注意事项:

看来Window标签只能有一个孩子。所以我需要将所有内容都包含在div中。

1 个答案:

答案 0 :(得分:1)

Windows和Window看起来像你想要的那样工作很棘手。几天前我遇到了Windows的问题,并且使用了由cthrax在github上发布的Window的解决方案:

https://github.com/angular-ui/angular-google-maps/issues/633

希望对你有帮助。