角度ui谷歌地图

时间:2014-02-06 08:54:48

标签: angularjs google-maps angular-ui

我正在尝试将angularUI Google Map(https://github.com/angular-ui/ui-map)插入到我的页面中。但它正在抛出以下错误

错误:google.maps.LatLng不是构造函数

以下是我的代码

HTML

<script src="../vendor/jquery/jquery-1.7.1.js"></script>
<script src="../vendor/jquery/jquery-ui.custom.js"></script>
<script src="../vendor/angular/angular.js"></script>
<script src="../vendor/bootstrap/ui-bootstrap-tpls-0.7.0.js"></script>
<!-- Google Map -->
<script src="../vendor/google/event.js "></script>
<script src="../vendor/google/ui-map.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&callback=onGoogleReady"></script>
<script>
    function onGoogleReady(){
        angular.bootstrap(document.getElementById("map"),['myApp']);
    }
</script>

<div ng-controller="myCtrl">
 <section id="map">
   <div ui-map="myMap" ui-options="mapOptions" class="google-map"></div>
 </section>
</div>

App.js

angular.module('myApp', ['ui.bootstrap','ui.map'])

.config(function ($routeProvider,$locationProvider) {
 //$locationProvider.html5Mode(true)
 $routeProvider.
     when('/page1', {templateUrl:'app/hotels/page1.html', controller:myCtrl}).
     when('/page2', {templateUrl:'app/hotels/page2.html', controller:myCtrl}).
     otherwise({redirectTo:'/page1'});
 })

function myCtrl($scope) {
/* Google Map */
 $scope.mapOptions = {
  center: new google.maps.LatLng(35.784, -78.670),
  zoom: 15,
  mapTypeId: google.maps.MapTypeId.ROADMAP
 };
}
myCtrl.$inject = ['$scope'];

我在每个页面都使用了一个通用控制器。任何人都可以帮我找到解决问题的方法 感谢

0 个答案:

没有答案