如何在页面加载离子2时自动加载地图标记？

Question

在Ionic2我使用休耕代码加载页面时加载的标记，但它显示错误：由

ionViewDidEnter(){ 
    this.Marker(); 
} 

view-controller.js:471 MapPage ionViewDidEnter error: Cannot read property 'getCenter' of null

更新1

initializeMap() { 

let minZoomLevel = 16; 
Geolocation.getCurrentPosition().then((position) => { 
this.map = new google.maps.Map(document.getElementById('map_canvas'), { 
zoom: minZoomLevel, 
center: new google.maps.LatLng(position.coords.latitude, position.coords.longitude), 
mapTypeControl: false, 
streetViewControl: false, 
disableDefaultUI: true, 
mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 
var trafficLayer = new google.maps.TrafficLayer(); 
     trafficLayer.setMap(this.map); 
    }); 
Marker(){ 
    let source = "origin"; 
    let image = 'assets/img/Untitled-1.png'; 
    let marker = new google.maps.Marker({  
    map: this.map, 
    animation: google.maps.Animation.DROP, 
    position: this.map.getCenter(), 
    draggable: true 
    , icon: image 
    }); 
    this.lastLatLng(marker,source); 
} 

在此代码我打电话marker()：截图在@ Rohit-kumar-vinay要求：

Answer 1

，我不得不做的唯一的事情是，呼叫this.Marker();在Geolocation.getCurrentPosition()函数的末尾。非常感谢Josh Morony。

Answer 2

您可以使用OnInit从@angular/core

1. 进口OnInint

   import { Component, OnInit } from '@angular/core'; 
   import { Geolocation } from 'ionic-native'; 
   

2. 实现出口类

   export class WelcomePage implements OnInit { 
       map:any 
   } 
   

3. 实现功能

   ngOnInit() { 
       this.map = this.initMap(); 
   } 
   
   initMap(): Promise<void> { 
   let promise: Promise<void> = new Promise<void>((resolve, reject) => { 
   Geolocation.getCurrentPosition().then((position) => { 
   
   let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
   let GooleMap = new google.maps.Map(document.getElementById('map'), { 
       center: latLng, 
       zoom: 18 
   }); 
   let marker = new google.maps.Marker({ 
       position: latLng, 
       map: GooleMap, 
       title: 'My Location', 
   }); 
   }); 
   }); 
   return promise; 
   } 
   

请按照以下Uber应用克隆链接使用ionic2 Youtube Link/ Github Link