傳遞對象以ng-地圖標記

Question

使用標記的部分在ng-map具有角JS

<ng-map zoom-to-include-markers="auto" default-style="false" class="myMap"> 
    <marker ng-repeat="Customer in ListForDisplay" position="{{Customer.location.lat}},{{Customer.location.lng}}" icon="{{Customer.icon}}" clickedaddress="{{Customer.address}}" clickedextras="{{Customer.extrasString}}" data="{{Customer}}" on-click="markerSingleClick($event)" on-dblclick="markerDoubleClick($event)"></marker> 
</ng-map> 

我可以訪問控制器中的字符串變量，但數據還停留在調試會話未定義對象：

$scope.markerSingleClick = function (event) { 
    var clickedaddress = this.clickedaddress; 
    var clickedextras = this.clickedextras; 
    var data = this.data; 

有一種方法來傳遞整個對象作爲標記的一部分，而不是單一的字符串屬性

Answer 1

要通過當前對象經由標記on-click事件的參數，代替

on-click="markerSingleClick($event)" 

與

on-click="markerSingleClick({{Customer}})" 

，然後更新markerSingleClick功能：

$scope.markerSingleClick= function (event,customer) { 
    //...   
}; 

工作實施例

angular.module('mapApp', ['ngMap']) 
 
    .controller('mapCtrl', function ($scope, NgMap) { 
 

 

 
     NgMap.getMap().then(function (map) { 
 
      $scope.map = map; 
 
     }); 
 
     $scope.cities = [ 
 
      { id: 1, name: 'Oslo', pos: [59.923043, 10.752839] }, 
 
      { id: 2, name: 'Stockholm', pos: [59.339025, 18.065818] }, 
 
      { id: 3, name: 'Copenhagen', pos: [55.675507, 12.574227] }, 
 
      { id: 4, name: 'Berlin', pos: [52.521248, 13.399038] }, 
 
      { id: 5, name: 'Paris', pos: [48.856127, 2.346525] } 
 
     ]; 
 

 
     $scope.showInfo = function (event,city) { 
 
       alert(JSON.stringify(city)); 
 
       //console.log(city); 
 
     }; 
 
    });

<script src="https://code.angularjs.org/1.4.8/angular.js"></script> 
 
    <script src="https://maps.googleapis.com/maps/api/js?key="></script> 
 
    <script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script> 
 
<div ng-app="mapApp" ng-controller="mapCtrl"> 
 
     <ng-map zoom="5" center="59.339025, 18.065818">    
 
      <marker ng-repeat="c in cities" position="{{c.pos}}" title="{{c.name}}" id="{{c.id}}" on-click="showInfo({{c}})"> 
 
      </marker> 
 
     </ng-map> 
 
    </div>

---

另一種選擇是通過對象標識符作爲參數，例如其指標：

<marker ng-repeat="c in cities" on-click="showInfo($index)" position="{{c.pos}}" title="{{c.name}}" id="{{c.id}}"> 
</marker> 

然後當前對象可被確定如下：

$scope.showInfo = function (event,index) { 
    var currentCity = $scope.cities[index]; 
    //console.log(currentCity); 
};