Javascript angularjs谷歌地图-信息窗口不适用于ng repeat
我使用谷歌地图与ng地图,并使用标记和信息窗口附加到这些标记添加到地图与ng重复。我的视角如下:Javascript angularjs谷歌地图-信息窗口不适用于ng repeat,javascript,angularjs,google-maps,google-maps-api-3,angularjs-google-maps,Javascript,Angularjs,Google Maps,Google Maps Api 3,Angularjs Google Maps,我使用谷歌地图与ng地图,并使用标记和信息窗口附加到这些标记添加到地图与ng重复。我的视角如下: <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
<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。这似乎没有什么问题,在加载视图和控制器后,标记和信息窗口在DOM中列出得很好
这些标记在地图上显示得很好,因为它们在执行on-bounds_changed=getLocations函数时会更新
信息窗口列表也在getLocations中更新,标记和信息窗口可以在DOM中看到,但是当我单击相应的标记时,信息窗口不会显示。尝试在视图中使用单个信息窗口项,并在用户单击标记时更新其内容,但未发生任何更改
有人能给我指一下我在这里没有做什么的正确方向吗?多谢各位
第二个问题:如果我必须在信息窗口内容中使用ng non bindable,否则ng map会投诉,我如何动态更新/生成信息窗口的内容?但是这个问题只有在显示infow窗口后才会出现。很抱歉响应太晚 简短回答,信息窗口不得与ng repeat一起使用
很抱歉反应太晚 简短回答,信息窗口不得与ng repeat一起使用
<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>