Search code examples
javascriptangularjsmarkerng-map

Get latlng of a marker with ng-map angularjs


I'm trying to get the latlng when the marker drop for first time or any time, but I can't. In my code only I can get the latlng when the marker is on-dragend.

this is my code:

<body>
  <div ng-controller="MyCtrl">
    <ng-map 
    zoom="16" 
    center="{{address}}" 
    style="width:500px; height:400px"
    scrollwheel = "false">
      <marker 
      position="{{address}}" 
      title="{{address}}"
      on-dragend="getpos($event)"
      animation="DROP" 
      draggable="true">
      </marker>
    </ng-map>
    <br/>Address : <input ng-model="data.dir" />
    <input type="button" name="" id="" value="buscar" ng-click="buscar()"/>
    <br />
    {{data.emp_lat}}-----------{{data.emp_lon}}
  </div>
</body>
</html>

this is my js:

angular.module('ngMap').controller('MyCtrl', function($scope) {
  $scope.data = {};
  $scope.address = 'toronto canada';
  $scope.buscar = function(){
    $scope.address = $scope.data.dir;
  }
  $scope.getpos = function(event){
        $scope.latlng = [event.latLng.lat(), event.latLng.lng()];
        $scope.data.emp_lat = event.latLng.lat();
        $scope.data.emp_lon = event.latLng.lng();
    };
});

My question is how can i get the latlng when the marker drops? (this should happen after set the address in my input)

Thanks friends


Solution

  • https://developers.google.com/maps/documentation/javascript/reference#Marker

    Have you tried position_changed?

    https://plnkr.co/edit/0aIlq0iQfQkvU3nreVyY?p=preview

    Can you try to create a plunker for this next time?

    NOTE: you shouldn't add controller directly to ng-map module.