1

Google maps allows one to get the coordinates from the auto-complete library. I cannot seem to find a way of doing it with ngMap without involving the "controller as" syntax. I want to get the coordinates and output them to console with just $scope.

var app = angular.module("App", ["ngMap"]);

app.controller("MyCtrl", function ($scope, NgMap) {

$scope.placeChanged = function placeChanged() {      
    var place = this.getPlace();
    console.log(place.place.geometry.location)
  };
  
});
<html ng-app="App">

<script src="https://maps.google.com/maps/api/js?libraries=places"></script>
<script src="https://code.angularjs.org/1.3.15/angular.js"></script>
<script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script>

<div ng-controller="MyCtrl">
<input type="text" name="address" places-auto-complete ng-model="address" on-place-change="placeChanged()">
</div>

</html>

1 Answers1

0

Directive places-auto-complete has on-place-changed in NgMap

html:

<div ng-controller="MyCtrl">
  <input places-auto-complete ng-model='address' on-place-changed="getCoords()" />
</div>

Script: when the place changes ng-model is updated and the

var app = angular.module("App", ["ngMap"]);
app.controller("MyCtrl", function($scope, NgMap) {
  $scope.address = '';
  $scope.getCoords = function() { 
    NgMap.getGeoLocation($scope.address).then(function(latlng) {
      console.log(latlng.lat());
      console.log(latlng.lng());
    });
  };
})
Searching
  • 2,269
  • 1
  • 17
  • 28