如何在angular.js控制器中添加Google地圖？

所以，我相當新的角度和艱難的時間實施谷歌地圖API。我不斷收到錯誤：如何在angular.js控制器中添加Google地圖？

我有這樣的腳本標籤：

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

但因爲我的功能初始化（）是我的控制器內，它不承認它。如果我把這個功能放在控制器之外，它確實可以識別它。但是因爲我擁有控制器中定義的所有數據，所以我需要它。我甚至不知道我應該問什麼，但我只需要讓地圖顯示出來。有任何想法嗎？

來源

2016-04-15 jake

我覺得這是[this]的一個雙精度（http://stackoverflow.com/questions/14184956/async-g oogle-maps-api-v3-undefined-is-not-a-function） – rick

你能否用簡單的語言解釋一下？我讀了幾次，仍然很難。 – jake

我認爲你應該添加幾何圖形和地方，以便你可以看到地方 –

你可以考慮加載谷歌地圖API 同步這表現如下

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>

來源

2016-04-15 09:29:01

在這個代碼API密鑰應該放在哪裏？ – AlexP

@AlexP，通過查詢字符串，例如：'https://maps.googleapis.com/maps/api/js?key=-YOUR-KEY-GOES-HERE-' –

所以我需要把'\t <腳本src =「https://maps.googleapis.com/maps/api/js?key=myInitialize&callback=initialize」> '進入主頁面（包含'

'的那個'？因爲我仍然描述了相同的錯誤這裏甚至在實現你的解決方案 – AlexP

您必須閱讀此documentation並使用簡單的googlemap angularjs指令。

我希望這對你的作品

一切順利

來源

2016-04-15 06:58:03

如何在angular.js控制器中添加Google地圖？

回答

相關問題