Angular 5/谷歌地图 - "ReferenceError: google is not defined"

Question

我将 Angular 5 与一种类型一起使用:“@types/markerclustererplus”:“2.1.28”。这种类型安装@types/google-maps。

我在“index.html”文件中添加了脚本部分来加载 map 。在我的组件中，我可以使用 google 命名空间。这很好用。

但是，当我运行测试时...它失败了!我收到“ReferenceError: google is not defined”

我尝试了很多东西...如果您有任何想法，我接受!

谢谢。

Answer 1

在您的测试中，您可以使用模拟/ stub 在 window 对象以及您的组件与之交互的任何其他对象/函数上定义 google:

window['google'] = {
  maps: {
    Maps: () => {}
  }
};

然后您可以使用 using Jasmine Spies拦截对 google 上给定对象和/或函数的调用，例如 maps 以返回自定义值或测试组件所需的任何其他内容。

const spy = spyOn(window['google']['maps'], 'Maps').and.returnValue({});

使用括号表示法来取悦 TypeScript 编译器的原因。使用点符号，您会看到诸如 Property 'google' does not exist on type 'Window' 之类的错误。

希望这至少有助于解决您看到的未定义错误。

谢谢!