Я пытаюсь добавить карты Google в свое веб-приложение, но в любом случае мне удается просто получить пустой экран и усугубить ситуацию без ошибок! Вот мой код до сих пор. Я чувствую, что это может быть чем-то, что связано с mapElement, но мои знания машинописи слишком скудны, и ничто из того, что я нашел в Интернете, кажется, не работает
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
@Component({
selector: 'app-google-maps',
templateUrl: './google-maps.component.html',
styleUrls: ['./google-maps.component.scss'],
})
export class GoogleMapsComponent implements OnInit {
@ViewChild('map', { static: false }) mapElement: ElementRef;
text: string;
map: any;
constructor() {
this.text = "hello World"
}
initMap() {
let coords = new google.maps.LatLng(45, 100);
let mapOptions: google.maps.MapOptions = {
center: coords,
zoom: 20,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
}
ngAfterContentInit() {
this.initMap();
}
ngOnInit() {
}
}
Затем пытаюсь использовать компонент в events.html
<ion-header>
<ion-toolbar color = "primary">
<ion-title>Events</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<app-google-maps></app-google-maps>
</ion-content>
Любая помощь будет принята с благодарностью!