4

编辑：我发现了问题。我正在使用 ng2-boostrap tabset 模块，在此视图中添加地图时，地图不会呈现。虽然我无法解决这个问题。

我正在开发一个 Angular 2 应用程序，我需要将谷歌地图模块导入到子模块中。我的问题是 - 我怎样才能正确地做到这一点？这是否可能。

我试过的：

我已经添加了import { AgmCoreModule } from 'angular2-google-maps/core';，AgmCoreModule.forRoot({ apiKey: 'xxx', libraries: ['places'] })其中 xxx 是我从谷歌 api 网站下载的 apiKey。如果我在新创建的 angular-cli 应用程序中运行此代码 - 将模块加载到 app.module 中，一切正常。选择器代码看起来：

    <sebm-google-map [latitude]="lat" [longitude]="lng">
          <sebm-google-map-marker [latitude]="latitude" [longitude]="longitude">
             </sebm-google-map-marker>
    </sebm-google-map>

但是，我想在一个名为 MapModule 的模块中使用它并将该模块导入到我的 app.module 中，所以我将 AgmCoreModule 导入到 MapModule 中，没有 forRoot()，并且选择器在 html 中被识别并且地图被加载但是该地图显示一个空视图 - 即有一个带有谷歌徽标和东西的地图，但没有内容 - 没有错误消息。我使用与我的测试示例完全相同的代码。

我还尝试使用 forRoot({apiKey: 'xxx'}) 添加 AgmCoreModule，结果相同。我从 App.module 中删除了导入，只导入到 MapModule 中，结果相同。

我在这里错过了什么吗？如果需要，我可以提供更多代码，但我认为我的问题在于缺乏进口知识。

亲切的问候克里斯

4

1 回答 1

0

您是否尝试过将此代码放入负责查看地图的组件中？

  import {MapsAPILoader, SebmGoogleMap} from 'angular2-google-maps/core';
  @ViewChild(SebmGoogleMap) map: SebmGoogleMap;

  this.map.triggerResize();

如果地图未在初始视图中呈现，例如。在 *ngif 块内然后出现问题。当您检查选项卡中的元素时，您会看到地图代码还是仅在地图选项卡被激活时才看到地图代码？

通常，当没有错误时， triggerResize() 将解决您的问题。

于 2017-02-07T06:08:40.783 回答