OverlappingMarkerSpiderfier 与 angular4答案

【问题标题】：OverlappingMarkerSpiderfier with angular4OverlappingMarkerSpiderfier 与 angular4
【发布时间】：2017-12-15 20:40:06
【问题描述】：

我正在尝试在我的 Angular 4 应用程序中使用 OverlappingMarkerSpiderfier 和传单。该模块在普通 js 和 angular 1 中运行良好。

但是当我尝试将它与 angular 4 一起使用时，它给了我错误

ERROR ReferenceError: OverlappingMarkerSpiderfier is not defined

我安装了overlapping-marker-spiderfier的时候就解决了

npm i overlapping-marker-spiderfier

然后它又给出了另一个错误

Uncaught ReferenceError: google is not defined

我应该怎么做才能让它工作

【问题讨论】：

【解决方案1】：

你可以通过使用 OverlappingMarkerSpiderfier javascript file 来解决这个问题。你必须以类似于谷歌地图的 npm 版本的 OverlappingMarkerSpiderfier 的方式更改文件。

添加

this['OverlappingMarkerSpiderfierLeafLet'] = (function() {
  if (this['L'] == null) {
    return;
}

在开头并将模块导出为

module.exports = this['OverlappingMarkerSpiderfierLeafLet'];

然后可以通过导入模块并像在html中一样使用它来使用它

【讨论】：

【解决方案2】：

首先我假设您的 google maps api 的脚本标签包含在 index.html 中。

您是否安装了@types/googlemaps？如果没有尝试安装它

npm install --save @types/googlemaps

然后将以下导入包含到您的组件中

import {} from '@types/googlemaps';

我希望这能解决您的问题。如果没有，请尝试在您的组件中声明它

declare var google: any;
@Component({
    ...
})

【讨论】：