angular – ionic 4 google-maps 5 beta“TypeError:无法读取属性’BaseClass’的null”

前端之家收集整理的这篇文章主要介绍了angular – ionic 4 google-maps 5 beta“TypeError:无法读取属性’BaseClass’的null”前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图使用离子4 google-maps@5.0.0-beta.20

我正在关注这些幻灯片https://docs.google.com/presentation/d/1zlkmoSY4AzDJc_P4IqWLnzct41IqHyzGkLeyhlAxMDE/edit#slide=id.g282d0a7bfd_0_140

我收到此错误:“TypeError:无法读取属性’BaseClass’的null”

newlocation.page.html:

<ion-content>
  <h3>Ionic GoogleMaps Starter</h3>
  <div id="map_canvas">

  </div>
</ion-content>

newlocation.page.scss:

map_canvas {
  height: 90%;
}

newlocation.page.ts:

import { Component,OnInit } from '@angular/core';
import { Platform } from '@ionic/angular';
import { GoogleMaps,GoogleMap } from '@ionic-native/google-maps';


@Component({
  selector: 'app-newlocation',templateUrl: './newlocation.page.html',styleUrls: ['./newlocation.page.scss'],})
export class NewlocationPage implements OnInit {

  map: GoogleMap;

  constructor(private platform: Platform) { }

  async ngOnInit() {
    await this.platform.ready();
    await this.loadMap();
  }

  loadMap() {
    this.map = GoogleMaps.create('map_canvas');
  }
}

的package.json:

....
"@ionic-native/core": "5.0.0-beta.14","@ionic-native/google-maps": "^5.0.0-beta.20"
....
"cordova-plugin-googlemaps": {
        "API_KEY_FOR_ANDROID": (API-KEY),"PLAY_SERVICES_VERSION": "15.0.1","ANDROID_SUPPORT_V4_VERSION": "27.+"
      }

解决方法

在Ionic V4中,我们需要定义loadMap()方法异步调用,它将返回promise.

async ngOnInit() {
  await this.platform.ready();
  await this.loadMap()
}

猜你在找的Angularjs相关文章