作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我将谷歌地图与 ng-map 一起使用,并使用附加到这些标记的标记和信息窗口,这些标记通过 ng-repeat 添加到 map 中。我的视角如下:
<div id="mapWrap" map-lazy-load="https://maps.google.com/maps/api/js">
<map center="current-location" zoom="9" on-bounds_changed="getLocations()">
<marker ng-repeat="myMarker in myMarkers"
clickable="true"
on-click="showInfoWindow(event, '{{myMarker.infoWindowId}}')"
id="{{myMarker.id}}"
position="[{{myMarker.lat}},{{myMarker.lon}}]"
title="{{myMarker.title}}"
draggable="false"
opacity="{{myMarker.opacity}}"
visible="{{myMarker.visible}}"
icon="{{myMarker.icon}}">
</marker>
<info-window ng-repeat="infoWindow in infoWindows"
id="{{infoWindow.id}}"
visible-on-marker="{{infoWindow.markerId}}">
<div ng-non-bindable="">
<h1>{{infoWindow.name}}</h1>
<p>{{infoWindow.text}}</p>
<a href="{{infoWindow.url}}">Get forecast</a>
</div>
</info-window>
</map>
</div>
myMarker.infoWindowId
对应infoWindow.id
,myMarker.id
对应infoWindow.markerId
。这似乎没有问题,加载 View 和 Controller 后,标记和信息窗口在 DOM 中列出得很好。
标记在 map 上显示得很好,因为它们会在执行 on-bounds_changed="getLocations()"
函数时更新。
信息窗口列表也在 getLocations()
中更新,标记和信息窗口可以在 DOM 中看到,但是当我点击时信息窗口没有显示相应的标记。尝试在 View 中使用单个信息窗口项并在用户单击标记时更新其内容,但没有任何改变。
任何人都可以指出我在这里没有做的事情的正确方向吗?谢谢。
第二个问题:如果我必须在信息窗口内容中使用 ng-non-bindable
(ng-map 否则会提示),我如何动态更新/生成信息的内容- window ?但是这个问题应该只有在显示 infow-windows 之后才会出现。
最佳答案
抱歉回复晚了。
简短回答,info-window
不能与 ng-repeat
一起使用。
http://plnkr.co/edit/lBxdmm?p=preview
<marker ng-repeat="myMarker in myMarkers"
name="A" text="B" url="http://foo.bar"
clickable="true"
on-click="showInfoWindow('myInfoWindow')"
id="{{myMarker.id}}"
position="[{{myMarker.lat}},{{myMarker.lng}}]"
draggable="false"
opacity="{{myMarker.opacity}}">
</marker>
<info-window id="myInfoWindow">
<div ng-non-bindable="">
<h1>{{this.name}}</h1>
<p>{{this.text}}</p>
<a href="{{this.url}}">Get forecast</a>
</div>
</info-window>
关于javascript - angularjs-google-maps - 信息窗口不适用于 ng-repeat,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31303121/
我是一名优秀的程序员,十分优秀!