Wie füge ich Google Map in angular.js Controller hinzu?

Also, ich bin relativ neu zu eckig und es ist schwer, Google Map API zu implementieren. Ich erhalte immer Fehler:Wie füge ich Google Map in angular.js Controller hinzu?

Ich habe dies für den Skript-Tag:

<script src="https://maps.googleapis.com/maps/api/js?key=MY API KEY GOES HERE&callback=initialize" 
    async defer></script>

Aber da meine Funktion initialize() ist in meinem Controller, ist es nicht zu erkennen. Wenn ich die Funktion außerhalb des Controllers platziere, erkennt sie es. Aber da ich alle Daten innerhalb des Controllers definiert habe, brauche ich das drin. Ich bin mir nicht einmal sicher, was ich eigentlich fragen soll, aber ich muss nur die Karte zeigen. Irgendwelche Ideen?

Quelle

2016-04-15 jake

ich das denke, demonstriert laden betrachten ist ein Double von [this] (http://stackoverflow.com/questions/14184956/async-g oogle-maps-api-v3-undefined-is-not-a-function) – rick

Können Sie das leichter erklären? Ich habe es ein paar Mal gelesen und habe immer noch Schwierigkeiten. – jake

Ich denke, Sie sollten Bibliotheken von Geometrie und Orten hinzufügen, so dass Sie Orte sehen können –

Sie können Google Maps API synchron wie unten

angular.module('myApp', []) 
 
    .controller('MyCtrl', function($scope) { 
 
     
 
     $scope.initialize = function() { 
 
      var map = new google.maps.Map(document.getElementById('map_div'), { 
 
      center: {lat: -34.397, lng: 150.644}, 
 
      zoom: 8 
 
      }); 
 
     }  
 
     
 
     google.maps.event.addDomListener(window, 'load', $scope.initialize); 
 

 
    });

html, body { 
 
     height: 100%; 
 
     margin: 0; 
 
     padding: 0; 
 
} 
 
#map_div { 
 
     height: 480px; 
 
}

<script src="https://code.angularjs.org/1.3.15/angular.js"></script> 
 
<script src="https://maps.googleapis.com/maps/api/js" ></script> 
 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <div id="map_div"></div> 
 
</div>

Quelle

2016-04-15 09:29:01

In diesem Code, wo API KEY gesetzt werden sollte? – AlexP

@AlexP, über Query-String, zum Beispiel: 'https://maps.googleapis.com/maps/api/js?key=-YOUR-KEY-GOES-HERE-' –

Also muss ich '\t 'in die Hauptseite (diejenige, die'

'enthält? Weil ich immer noch denselben Fehler beschrieben habe hier sogar nach der Implementierung Ihrer Lösung – AlexP

Sie müssen diese documentation lesen und einfache googlemap map angularjs Direktive verwenden.

Ich hoffe, das funktioniert für Sie

alles Gute

Quelle

2016-04-15 06:58:03

Wie füge ich Google Map in angular.js Controller hinzu?

Antwort

Verwandte Themen