ReferenceError：google沒有定義

Question

我想將Google地圖嵌入到我的項目中，但遇到了這個問題，我正在尋找許多解決方案，但沒有解決我的問題。我真的不明白爲什麼會出現這個錯誤！ 這是我的JavaScript文件

var mapOptions = { 
       zoom: 4, 
       center: new google.maps.LatLng(25,80), 
       mapTypeId: google.maps.MapTypeId.TERRAIN 
      } 

      $scope.map = new google.maps.Map(document.getElementById('map'), mapOptions); 

      $scope.markers = []; 

      var infoWindow = new google.maps.InfoWindow(); 

      var createMarker = function (info){ 

       var marker = new google.maps.Marker({ 
        map: $scope.map, 
        position: new google.maps.LatLng(info.lat, info.long), 
        title: info.city 
       }); 
       marker.content = '<div class="infoWindowContent">' + info.desc + '</div>'; 

       google.maps.event.addListener(marker, 'click', function(){ 
        infoWindow.setContent('<h2>' + marker.title + '</h2>' + marker.content); 
        infoWindow.open($scope.map, marker); 
       }); 

       $scope.markers.push(marker); 

      } 

      for (i = 0; i < cities.length; i++){ 
       createMarker(cities[i]); 
      } 

      $scope.openInfoWindow = function(e, selectedMarker){ 
       e.preventDefault(); 
       google.maps.event.trigger(selectedMarker, 'click'); 
      } 

Answer 1

據我所知，您正在使用的角度和普通的谷歌SDK，它是疼痛（你必須使用$適用於任何地方，你必須自己破壞事件等），你一定要結賬angular-google-maps模塊，它有很大的documentation，下面的工作簡單的演示

angular.module('app', ['uiGmapgoogle-maps']).controller('ctrl', function($scope){ 
 
    $scope.map = { center: { latitude: 45, longitude: -73 }, zoom: 8 }; 
 
});

.angular-google-map-container { height: 400px; }

<script src='http://maps.googleapis.com/maps/api/js'></script> 
 
<script src=" 
 
http://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.js"></script> 
 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.js"></script> 
 
<script src="https://rawgit.com/angular-ui/angular-google-maps/master/dist/angular-google-maps.js"></script> 
 
<script src="http://rawgit.com/nmccready/angular-simple-logger/master/dist/angular-simple-logger.js"></script> 
 

 
<div ng-app="app" ng-controller="ctrl"> 
 
    <ui-gmap-google-map center='map.center' zoom='map.zoom'></ui-gmap-google-map> 
 
</div>