Google maps google地图错误-ReferenceError:在爱奥尼亚3应用程序中未定义google

我正在将谷歌地图加载到我的爱奥尼亚3应用程序页面。当我使用浏览器加载应用程序时，页面加载正常，但当我使应用程序apk（使用

ionic cordova build android--prod

）时，地图没有加载，如果引用错误，则引发异常：未定义google。我已经在谷歌上搜索了几天，我已经应用了我得到的所有解决方案，但毫无用处。谁能帮我解决这个问题

我的map.ts代码如下：

 import {Component, ViewChild, ElementRef} from '@angular/core';
    import {IonicPage, NavController, NavParams, PopoverController, LoadingController, MenuController} from 'ionic-angular';
    import {Keyboard} from '@ionic-native/keyboard';
    import {Geolocation, Geoposition} from '@ionic-native/geolocation';
    import {NativeGeocoder, NativeGeocoderReverseResult} from '@ionic-native/native-geocoder';
    import {LocationAccuracy} from '@ionic-native/location-accuracy';

declare var google: any;

@IonicPage()
@Component({
  selector: 'page-map',
  templateUrl: 'map.html',
})
export class Map {

  latLng: any;
  @ViewChild('map') mapElement: ElementRef;
  map: any;
  showFooter: boolean = true;

  constructor(public navCtrl: NavController,
              public navParams: NavParams,
              public popoverCtrl: PopoverController,
              private geolocation: Geolocation,
              public locac: LocationAccuracy,
              public loadingCtrl: LoadingController,
              public keyboard: Keyboard,
              private menu: MenuController,
              public geocoder: NativeGeocoder,) {
  }

   ionViewDidLoad() {
     this.getLocation();
     this.menu.swipeEnable(false);
  }

getLocation() {

    this.geolocation.getCurrentPosition().then((resp) => {

      let map = new google.maps.Map(document.getElementById('map'));
      var uluru = {lat: -25.363, lng: 131.044};
      this.latLng = new google.maps.LatLng(resp.coords.latitude, resp.coords.longitude);
      let mapOptions = {
        center: this.latLng,
        zoom: 18,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        enableHighAccuracy: true
      };

      this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);

      let marker = new google.maps.Marker({
        map: this.map,
        animation: google.maps.Animation.DROP,
        position: this.latLng,
        center: this.latLng,
        icon: {
          url: 'assets/img/pin.png',
          size: new google.maps.Size(25, 48)
        },
        optimized: false,
      });

      // geocode reverse
      var geocoder = geocoder = new google.maps.Geocoder();

      var latlng = new google.maps.LatLng(resp.coords.latitude, resp.coords.longitude);
      geocoder.geocode({'latLng': latlng}, function (results, status) {
        console.log(results);
        alert('Status : ' + status);
        this.currentLocation = this.value = "My value";
        if (status == google.maps.GeocoderStatus.OK) {
          if (results[1]) {
            document.getElementById("currentlocation").setAttribute('value', results[1].formatted_address);
          }
        }
      });
      // geocode reverse end

      // Route and direction
      var source, destination;
      var directionsDisplay;
      var directionsService = new google.maps.DirectionsService();
      directionsDisplay = new google.maps.DirectionsRenderer({'draggable': true});

      // current location input
      let currentlocationinput = document.getElementById('currentlocation');
      let currentlocationsearchBox = new google.maps.places.SearchBox(currentlocationinput);
      map.controls[google.maps.ControlPosition.TOP_LEFT].push(currentlocationinput);

      // destination location input
      let destinationinput = document.getElementById('destination');
      let destinationsearchBox = new google.maps.places.SearchBox(destinationinput);
      map.controls[google.maps.ControlPosition.TOP_LEFT].push(destinationinput);

      // Direction
      var directionsService = new google.maps.DirectionsService;
      var directionsDisplay = new google.maps.DirectionsRenderer;
      directionsDisplay.setMap(map);

      // on drag and dragend header style change
      this.map.addListener('dragstart', function (event) {
        document.querySelector(".header")['style'].transform = 'translate3d(0px, -320px, 0px)';
        document.querySelector(".scroll-content").classList.add("no_margin");
        document.querySelector(".footer")['style'].transform = 'translate3d(0px, 320px, 0px)';
      });
      this.map.addListener('dragend', function (event) {
        document.querySelector(".header")['style'].transform = 'translate3d(0px, 0px, 0px)';
        document.querySelector(".scroll-content").classList.remove("no_margin");
        document.querySelector(".footer")['style'].transform = 'translate3d(0px, 0px, 0px)';
      });
      // on drag and dragend header style change end

    }).catch((error) => {
      alert(error);
      console.log('Error getting location', error);
    })

  }
}

这件事我坚持了几天。如果有人能解决，请帮我解决。提前谢谢。

检查一下

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

您可以将其添加到index.js，也可以不添加

我想当您访问地图时，它不会被加载。

检查一下

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

您可以将其添加到index.js，也可以不添加

我认为当您访问地图时，它不会被加载。

[SOLVED]

几乎要放弃了，直到我找到了他的答案

可能对和我一样被绞死的人有用

干杯

[已解决]

几乎要放弃了，直到我找到了他的答案

可能对和我一样被绞死的人有用

---

干杯

是的，我已经加了。但同样的问题<代码>是的，我已经添加了它。但同样的问题<代码>