Google Map : Cannot read property 'nativeElement' of undefined

Hi,

I get this error when I’m trying to load google map on the first screen of my App. “Cannot read property ‘nativeElement’ of undefined”

Below the code I’m using

Blockquotedeclare var google: any;

export class AlertMainFeedPage implements OnInit {

map: any;

@ViewChild(‘map’, {read: ElementRef, static: false}) mapRef: ElementRef;

constructor(
private geolocation: Geolocation

)

{ 

}

ngOnInit() {

this.showMap

}

}
showMap() {

const location = new google.maps.LatLng(46.2043907, 6.1431577);
const options = {
center : location,
zoom : 15,
disableDefaultUI: true
}

this.map = new google.maps.Map(this.mapRef.nativeElement, options);

}

}

}

Blockquote

It’s strange because when I go to an another page, the same code is working. It’s just not working on the first page?!?!

Many thanks for your help

I found the solution.

I replace : @ViewChild(‘map’, {read: ElementRef, static: false}) mapRef: ElementRef;

by : @ViewChild(‘map’, {static: true}) mapElement: ElementRef;

All is working well :slight_smile:

1 Like