Question

寻找解决方案并尝试了迄今为止我发现的大部分内容。我是谷歌地图和Javascript的新手。希望有人能看到我在这里失踪的东西（并提前感谢你！）。

我直接使用Google Maps Tutorial中的示例。我按照异步加载API的说明进行了大约一半的操作。

我按照规定处理了代码。在页面上创建了div元素，确保了body和div的高度和宽度。在使用调试器逐步执行代码时，它会通过loadScript成功设置DOM上的脚本。然后它在完成后立即失败（看起来似乎）。我可以告诉它，有点看起来初始化函数是未定义的？不确定我需要做什么。

再次，非常感谢帮助/见解。我的额头受伤了;）

bower.json

{ ＆＃34; name＆＃34;：＆＃34; movin-there＆＃34;，＆＃34;私人＆＃34;：是的，＆＃34;依赖＆＃34;：{ ＆＃34; angular＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34; json3＆＃34;：＆＃34; ^ 3.3.0＆＃34;，＆＃34; angular-bootstrap＆＃34;：＆＃34; ~0.12.0＆＃34;，＆＃34; bootstrap＆＃34;：＆＃34; ~3.2.0＆＃34;，＆＃34; angular-animate＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34; angular-cookies＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34; angular-resource＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34; angular-route＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34; angular-sanitize＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34; angular-touch＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34; lodash＆＃34;：＆＃34; ~2.4.1＆＃34; }，＆＃34; devDependencies＆＃34;：{ ＆＃34;棱角分明＆＃34;：＆＃34; ~1.2.28＆＃34;，＆＃34;角度情景＆＃34;：＆＃34; ~1.2.28＆＃34; }，＆＃34; appPath＆＃34;：＆＃34; app＆＃34;，＆＃34;决议＆＃34;：{ ＆＃34;棱角分明＆＃34;：＆＃34; 1.2.28＆＃34; } }

日志控制台输出###

未捕获的TypeError：undefined不是函数VM23109：1
（匿名函数）main.js：13
（匿名函数）main.js：26
（匿名函数）main.js：25
Jf main.js：26
Zf main.js：54
（匿名函数）main.js：54
google.maps.Load js？v = 3.exp＆amp; callback = initialize：21
（匿名函数）main.js：55
（匿名函数）

app.js

＆＃13;

//app.js
//
angular.module('MovnThereUI',[
    'ui.bootstrap',
    'ngAnimate',
    'ngCookies',
    'ngResource',
    'ngRoute',
    'ngSanitize',
    'ngTouch'
  ]).run([
        '$rootScope',
        '$location',
        '$http',
        '$window',
        'AuthFactory',
        'UserFactory',
        'TypeAheadFactory',
        function(
            $rootScope,
            $location,
            $http,
            $window,
            AuthFactory,
            UserFactory,
            TypeAheadFactory
        ) {
            'use strict';
            $rootScope.$on('$routeChangeStart', function(event, next) {

                if (AuthFactory.isAuthenticated()) {
                    if (AuthFactory.isAuthenticated()) {
                        $http.defaults.headers.common['Authorization'] = 'Token token=' + $window.sessionStorage.getItem('movnThereUI.user');
                    }

                    UserFactory.fetch();
                } else {
                    if (($location.path() !== '/login') && ($location.path() !== '/signup')) {
                        $location.path('/login');
                    }
                }
            });



            function initialize() {
                debugger;
              var mapOptions = {
                zoom: 8,
                center: new google.maps.LatLng(-34.397, 150.644)
              };

              var map = new google.maps.Map(document.getElementById('map-canvas'),
                  mapOptions);
            }

            function loadScript() {
              var script = document.createElement('script');
              script.type = 'text/javascript';
              script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&' +
                  'callback=initialize';
              document.body.appendChild(script);
            }

            window.onload = loadScript;



        }
    ]
);

＆＃13;

/* app.css */
html, body, #map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

.nav, .pagination, .carousel, .panel-title a {
  cursor: pointer;
}

＆＃13;

<!-- index.html -->
</head>
  <body ng-app="MovnThereUI">

    <ng-include src="'views/partials/navbar.html'"></ng-include>

    <ng-view></ng-view>
    <div id="map-canvas"></div>
    
    .......snip

＆＃13;

Answer 1

只需要我的两分钱，intitialize应绑定到window对象，而不管加载gmap脚本的上下文。

所以我想解决这个问题，你可以尝试使用 window.initialize = function(){..}。但是有些人可能不想要这个！

Google Map JS V3异步加载 - 未捕获TypeError：undefined不是函数

bower.json

日志控制台输出###

app.js

1 个答案: