angular - 使用选项时，Angular 中的 Google map 不显示 map

Question

我正在尝试使用@angular/google-maps 在我的Angular 应用程序中设置一个谷歌地图实例，一开始一切都非常简单；我使用本教程安装并创建了元素:https://timdeschryver.dev/blog/google-maps-as-an-angular-component

问题是，当我输入选项输入变量时， map 停止显示，并且控制台中没有消息。

这是代码 没有 选项:

<google-map
        [width]="'100%'"
        [height]="'100%'"
        [center]="center"
        [options]="mapOptions"
></google-map>

在这种情况下，这就是显示的内容:

This is the working example with no options

<google-map
        [width]="'100%'"
        [height]="'100%'"
        [center]="center"
></google-map>

使用以下选项:

import MapOptions = google.maps.MapOptions;
mapOptions: MapOptions = {
    mapTypeId: 'hybrid',
    zoomControl: false,
    scrollwheel: false,
    disableDoubleClickZoom: true,
    maxZoom: 15,
    minZoom: 8
};

这是我输入选项时显示的内容:

This is the example that has the option and somehow doesn't work

我到处寻找，似乎找不到任何解决方案；显然，我已按照文档中的说明对其进行了配置，但它不起作用。我也尝试使用较少或不使用选项，但它也不起作用。由于控制台中没有输出，我只是无法弄清楚问题所在......

Answer 1

我遇到了同样的问题。
我实际上不知道为什么，但在选项中设置缩放级别为我修复了这个错误:

mapOptions: MapOptions = {
    mapTypeId: 'hybrid',
    zoomControl: false,
    scrollwheel: false,
    disableDoubleClickZoom: true,
    maxZoom: 20,
    minZoom: 8,
    zoom: 19
};