AngularJS，在加载谷歌地图 API 时暂停答案

【问题标题】：AngularJS, pause while loading Google Maps APIAngularJS，在加载谷歌地图 API 时暂停
【发布时间】：2017-06-07 07:56:33
【问题描述】：

我正在使用 Angular Google Maps 加载 Google Maps API，但加载 API 脚本时会有 3-4 秒的暂停。因此页面上的所有内容都已加载-> 3-4 秒暂停-> API 脚本开始加载-> 地图显示。

看起来它只是在等待一些计时器事件：

谷歌地图配置 sn-p：

  uiGmapGoogleMapApiProvider.configure({
    key: 'xxxxxxxxxx',
    v: '3',
    libraries: 'geocoder',
    preventLoad: false,
    china: false,
    transport: 'https'
  });

地图在这里加载：

    <div id="shopMap" ng-init="initShopMap()"></div>

通过这个函数：

$scope.initShopMap = function() {
  if ($scope.shop.latitude && $scope.shop.longitude) {
    uiGmapGoogleMapApi.then(function(maps) {
      shopMap = new maps.Map(document.getElementById("shopMap"), {
        control: {},
        options: {
          draggable: true,
          scrollwheel: false
        },
        center: new maps.LatLng(0, 0),
        zoom: 14,
        marker: {
          options: {
            icon: {
              scaledSize: { width: 24, height: 36 },
              url: '/images/pm-shop-icon.png'
            }
          }
        }
      });

      directionsService = new maps.DirectionsService();

      initMarkers();
      $scope.showShopMap = true;
    });
  }
}

任何想法为什么会发生这种延迟？非常感谢任何提示，谢谢✨

【问题讨论】：

标签： javascript angularjs google-maps google-maps-api-3

【解决方案1】：

原来，这个项目的api加载错误，index.htm中没有这行：

 <script async defer
      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
    </script>

我想知道如果没有这条线，地图是如何工作的:)

【讨论】：