How to update map coordinates when dragging google map marker?

Question

JavaScript

There is such a code

<ng-map zoom="12" center="{{map.address}}" default-style="true">
  <marker ng-repeat="marker in myMarkers" id="{{marker.id}}" position="{{marker.position}}" on-click="showDetail(event, marker)" icon="https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png" animation="DROP" draggable="true"></marker>
  <info-window id="bar" max-width="200">
        <div >
      Position: {{anchor.getPosition()}}<br/>
      <a href="#" ng-click="closeInfo()">Click Here</a>
    </div>
  </info-window>
</ng-map>

Angular code

$scope.placeChanged = function() {
      vm.place = this.getPlace();
      vm.map.setCenter(vm.place.geometry.location);
      $scope.myMarkers = [];
      $scope.myMarkers.push({
        id: 'generalMarker',
        position: [vm.place.geometry.location.lat(),vm.place.geometry.location.lng()],
        name: 'marker'
      })
      
    };
    $scope.showDetail = function(e, marker) {
      vm.map.showInfoWindow('bar', marker.id);
    };
    
    $scope.closeInfo = function(e) {
      vm.map.hideInfoWindow('bar');
    };

The problem is, when I click on the marker, coordinates appear in the info window, I move the label, the coordinates do not change, only on the next click, but I need to make sure that I hold the label, start moving it and new coordinates are displayed in the info window. How to do it?

Answer 1

In native js:

google.maps.event.addListener(marker, 'dragend', function(evt){
   // do code here
}

if all over - drag instead of dragend