0
イオン2を使用していて、JS APIを使用してGoogleマップをロードしようとしています。ここ は私のコードです:Ionic 2 Google Maps ::未知(未定):TypeError:nullの 'firstChild'プロパティを読み取れません
import { Component, ViewChild, ElementRef } from '@angular/core';
import { NavController, Platform, NavParams } from 'ionic-angular';
declare var google;
@Component({
selector: 'page-map',
templateUrl: 'map.html',
})
export class MapPage {
@ViewChild('map') mapElement: ElementRef;
map: any;
latitude : any;
longitude : any;
constructor(public platform: Platform, public navCtrl: NavController,public navParams: NavParams) {
this.platform = platform;
this.initializeMap();
}
ionViewDidLoad(){
this.initializeMap();
}
initializeMap() {
this.platform.ready().then(() => {
var minZoomLevel = 12;
this.map = new google.maps.Map(document.getElementById('map'), {
zoom: minZoomLevel,
center: new google.maps.LatLng(38.50, -90.50),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var position = new google.maps.LatLng("23.032612699999998", "72.56187790000001");
var dogwalkMarker = new google.maps.Marker({position: position, title: "Testing"});
dogwalkMarker.setMap(this.map);
});
}
}
私もcordova.js前に私のindex.htmlファイルにJSの参照を追加しました:ここ
<script src="http://maps.google.com/maps/api/js"></script>
は私のhtmlです:
<ion-header>
<ion-navbar hideBackButton side="left">
<ion-title style="margin-left: 0px;"><span class="menuTitle">Map</span></ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<div #map id="map"></div>
</ion-content>
コードにエラーは表示されませんが、このページをロードしようとすると、次のようなエラーが表示されます。
キャッチされない(約束で):TypeError例外:プロパティを読み取ることができません 'のfirstChild' ヌルの
。ありがとう@hrdkisback – Aparna
@Aparna、これは答えとしてマークすることができますので、他の人はこの投稿から助けを得ることができます。ありがとう。 – hrdkisback