Не удается прочитать свойство 'offsetHeight' с нулевым значением Ionic 3 - PullRequest
0 голосов
/ 22 февраля 2019

У меня появляется следующая ошибка, когда я пытаюсь загрузить нативные карты Google в мое приложение ionic.

ERROR TypeError: Cannot read property 'offsetHeight' of undefined
at index.js:1024
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 e.invokeTask (polyfills.js:3)
at i.isUsingGlobalCallback.invoke (polyfills.js:3)
at n (polyfills.js:3)

Моя версия Google Maps v5.0.0.beta22

И это моякод в file.ts:

import {
 GoogleMaps,
 GoogleMap,
} from '@ionic-native/google-maps';



@IonicPage()
   @Component({
    selector: 'page-event-details',
    templateUrl: 'event-details.html',
   })

export class EventDetailsPage{
  map: GoogleMap

  async ngAfterViewInit() {
    await this.loadMap();
  }

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

Я пытаюсь с ngOnInit с ngAfterViewInit, с асинхронным без asinc, я не знаю, что делать дальше, пожалуйста, помогите мне решить эту проблему.Я импортирую в file.module.ts в app.module.ts, я выполняю скрипт: браузер ionic cordova запускается, и ошибка та же.

Мой HTML-код следующий:

<ion-content>
<div id="map_canvas"></div>
</ion-content>

Я пытался установить высоту до 100% при 150-500 пикселей, установить прозрачный фон, все.

Мой электронный адрес: juanma97@outlook.com Я могу использовать Skype, если вы предпочитаете, это очень важномне.Спасибо!

Мой пакет.json

    {
  "name": "App_events",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "start": "ionic-app-scripts serve",
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint"
  },
  "dependencies": {
    "@angular/animations": "7.2.6",
    "@angular/common": "7.2.6",
    "@angular/compiler": "7.2.6",
    "@angular/compiler-cli": "7.2.6",
    "@angular/core": "7.2.6",
    "@angular/forms": "7.2.6",
    "@angular/http": "7.2.6",
    "@angular/platform-browser": "7.2.6",
    "@angular/platform-browser-dynamic": "7.2.6",
    "@ionic-native/core": "^5.2.0",
    "@ionic-native/geolocation": "5.2.0",
    "@ionic-native/google-maps": "v5.0.0-beta.21",
    "@ionic-native/native-geocoder": "5.2.0",
    "@ionic-native/splash-screen": "5.2.0",
    "@ionic-native/status-bar": "5.2.0",
    "@ionic/pro": "^2.0.4",
    "@ionic/storage": "2.2.0",
    "angularfire2": "^5.1.1",
    "cordova-plugin-googlemaps": "2.5.1",
    "cordova-plugin-ionic": "^5.3.0",
    "cordova-plugin-nativegeocoder": "3.1.3",
    "firebase": "^5.8.2",
    "ionic-angular": "3.9.3",
    "ionicons": "4.5.5",
    "promise-polyfill": "^8.1.0",
    "rxjs": "^6.4.0",
    "rxjs-compat": "^6.4.0",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.29"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.2.2",
    "typescript": "3.3.3"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-geolocation": {},
      "cordova-plugin-nativegeocoder": {},
      "cordova-plugin-googlemaps": {
        "API_KEY_FOR_ANDROID": "AIzaSyBvrvKuOFHsMizEd9SYBBjllqWyfWlByLA",
        "API_KEY_FOR_IOS": "AIzaSyBvrvKuOFHsMizEd9SYBBjllqWyfWlByLA"
      }
    }
  }
}
...