gMaps MarkersとInfoWindowでAngularJSを使用

Question

ng-map私はAngularページにマップを実装し、this example（ng-map GitHub担当者のREADMEファイルでリンクされています）に従っています。

私の目的は、いくつかの関連情報を公開するために複数のマーカー（ng-repeatを使用）と1つの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> 

マイ（も単純化された）コントローラisteadは次のとおりです。

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が関連付けられています。