Question

我正在使用ng-map在我的Angular页面上实现地图并跟随this example（由ng-map GitHub rep上的README文件链接）。

我的目的是使用多个标记（使用ng-repeat）和一个InfoWindow来显示一些相关信息。为了简单起见，我使用的模型是律师。因此，标记将代表律师职位，infoWindow将公开他们的信息。

考虑到这一点，这是我的模板的代码（简化）：

<div>
  <ng-map default-style="true">

    <marker ng-repeat="lawyer in vm.data.lawyers track by $index" id="marker-{{$index}}" position="{{lawyer.address}}" on-click="vm.map.showInfoWindow('foo', 'marker-'+$index);"></marker> 

    <info-window id="foo" on-mouseover=vm.mouseover()>
      <div class="customWindow" ng-non-bindable="">
        My name is {{lawyer.firstname}}, etc...
      </div>
    </info-window>

  </ng-map>
</div>

我的（也简化）控制器主要是：

myCtrl(NgMap, authentication){
  var vm = this;

  //Getting the map instance
  NgMap
    .getMap()
    .then(function(map) {
      vm.map = map;
    });

   //Getting Data (lawyer and cabinet)
        authentication.lawyersAll()
            .success(function(data){
                vm.data = { lawyers: data }                    
            })
            .error(function(err){
                console.log(err);
            });

}

如何绑定标记和infoWindow？

Answer 1

我明白了。

是否可以在单击标记时使用自定义行为：单击后，将模型保存到控制器并从InfoWindow加载模型数据。很简单。

此处的示例：https://ngmap.github.io/#/!infowindow_ng_click.html内部关联了Pluncker。

gMaps标记和InfoWindow与AngularJS

1 个答案: