Good morning, I have a problem with Google Maps, all work correctly with ‘ionic cordova run browser’, but with ‘ionic serve’ not work in mobile phone, I want execute in mobile Android, real device. And I have the next error:
core.js:15714 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'BaseClass' of null
TypeError: Cannot read property 'BaseClass' of null
at GoogleMap.BaseClass (index.js:246)
at new GoogleMap (index.js:1094)
at GoogleMapsOriginal.create (index.js:203)
at EventDetailsPage.webpackJsonp.166.EventDetailsPage.loadMap (event-details.ts:47)
at event-details.ts:31
at t.invoke (polyfills.js:3)
at Object.onInvoke (core.js:17289)
at t.invoke (polyfills.js:3)
at r.run (polyfills.js:3)
at polyfills.js:3
at c (polyfills.js:3)
at polyfills.js:3
at t.invokeTask (polyfills.js:3)
at Object.onInvokeTask (core.js:17280)
at t.invokeTask (polyfills.js:3)
at r.runTask (polyfills.js:3)
at o (polyfills.js:3)
at e.invokeTask [as invoke] (polyfills.js:3)
at p (polyfills.js:2)
at HTMLImageElement.v (polyfills.js:2)
How I execute in mobile phone?
I have google-maps 5.0.0 beta 22
And the file .ts here:
import { Component, ViewChild, OnInit } from '@angular/core';
import { IonicPage, NavController, NavParams, Platform } from 'ionic-angular';
import { GoogleMaps, GoogleMap, GoogleMapOptions, Environment } from '@ionic-native/google-maps';
@IonicPage()
@Component({
selector: 'page-event-details',
templateUrl: 'event-details.html',
})
export class EventDetailsPage{
@ViewChild('map') element;
map: GoogleMap
event: any;
slideOpts = {
effect: 'flip'
};
constructor(public navCtrl: NavController,
public navParams: NavParams,
public platform: Platform) {
this.event = navParams.data;
}
goBack() {
this.navCtrl.pop();
}
ngAfterViewInit() {
this.platform.ready().then(() => {
this.loadMap();
});
}
loadMap() {
let mapOptions: GoogleMapOptions = {
camera: {
target: {
lat: this.event.latitude, // default location
lng: this.event.longitude // default location
},
zoom: 18,
tilt: 30
}
};
this.map = GoogleMaps.create('map_canvas', mapOptions);
}
}
Thank you!