5

Ich habe ein paar Probleme mit Google Maps Geocodierung API.Angular Google Maps Geocoding Rückruf

I Angular Google Maps verwenden und zu versuchen, eine Adresse mit einer Callback-Funktion geocodieren:

.controller('myCtrl', ['$scope', '$rootScope', 'uiGmapGoogleMapApi', function ($scope, $rootScope, uiGmapGoogleMapApi) { 

    // To be set by previous step 
    $rootScope.chosenTown = "Roma" 

    // geocode the given address 
    var geocodeAddress = function(address, callback) { 
     var geocoder = new google.maps.Geocoder(); 
     geocoder.geocode({ 'address': address}, function(results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
       callback(results[0].geometry.location); 
      } else { 
       console.log("Geocode was not successful for the following reason: " + status); 
      } 
     }); 
    }; 

    // google maps is ready 
    uiGmapGoogleMapApi.then(function(maps) { 
     // geocode chosen town 
     geocodeAddress($rootScope.chosenTown, function(latLng){ 
      console.log("1 " + latLng.lat()) 
      console.log("2 " + latLng.lng()) 
      $scope.map = { center: { latitude: latLng.lat(), longitude: latLng.lng() }, zoom: 12, bounds: {}}; 
     }); 

    }); 
}]) 

Und der HTML-Code:

<div class="col-lg-5 finalStepMap"> 
     <ui-gmap-google-map center='map.center' zoom='map.zoom' draggable="true" options="options" bounds="map.bounds"> 
      <ui-gmap-markers models="markers" coords="'self'" options="'options'"></ui-gmap-markers> 
     </ui-gmap-google-map> 
</div> 

Die Karte wird nicht angezeigt.

Allerdings, wenn ich rufe:

$scope.map = { center: { latitude: 10, longitude: 40}, zoom: 12, bounds: {}}; 
     }); 

Mit festem lat und lng außerhalb der Callback-Funktion, funktioniert alles einwandfrei.

Irgendwelche Hinweise?

Vielen Dank für Ihre wertvolle Hilfe :)

Antwort

3

nach mehr googeln, ich fand schließlich die Antwort!

Sie haben zu verwenden:

$scope.$apply(function() { 
    $scope.map = ... 
}); 
Verwandte Themen