问谷歌地图JavaScript应用编程接口显示灰色空白框而不是地图

EN

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { google } from 'google-maps';

@Component({
  selector: 'app-map',
  templateUrl: './map.component.html',
  styleUrls: ['./map.component.scss'],
})
export class MapComponent implements OnInit {
  // Map setup
  @ViewChild('mapElement', {static: true}) mapElement: ElementRef<HTMLElement>;
  map: google.maps.Map;

  constructor() {
  }
  ngOnInit() {
    console.log('Map')
    this.map = new google.maps.Map(this.mapElement.nativeElement, {
      mapTypeId: google.maps.MapTypeId.SATELLITE
    });
    google.maps.event.trigger(this.map, 'resize')
    console.log('Map Seconded')
  }
}

<div id="map-element" #mapElement></div>

#map-element {
    display: block;
    height: 400px;
}