我正在使用带有 Typescript 的 Angular 7.2.2。
我正在通过 index.html 中的 <script>-tag 从“https://maps.googleapis.com/maps/api/js?key=myAPIkey”导入 Google 地图
脚本加载完成后，我可以看到我的一些样式在应用程序范围内被 Google 地图的样式覆盖。
如何防止这种情况并确保 Google 地图的样式仅应用于我将在其中呈现地图的组件？
我尝试从显示组件中动态加载脚本，但显然样式封装仅适用于“styleUrls”参数提供的样式。
谢谢！
【问题讨论】：
标签： javascript css angular typescript google-maps
谢谢大家，我想我已经回答了我的问题。
以防其他人因这个愚蠢的错误而绊倒：
我使用 Angular Material，而后者又使用 Roboto Medium 作为默认字体。
由于我没有安装正确的网络字体，我的应用程序使用 Arial 作为备用。
现在，当我加载同样使用 Roboto 并正确加载该字体的 Google 地图脚本时，我的整个应用程序会从 Arial 切换到 Roboto。
这让我觉得样式被覆盖了。
（感谢 Lorenz 处理我糟糕的写作 :)）
【讨论】：
因此，您在 Angular 应用程序中使用的类在 Google Maps API 的样式中命名相同。
您的样式将按照您在 angular.json 文件中的顺序导入，然后您的 index.html 文件在初始化后加载其脚本，这发生在读取来自 angular.json 的样式表之后。
因此，您的选择似乎是更改正在被覆盖的类的名称，以便 Google 不会覆盖它们，因为我不知道 Google Maps 的 NPM 包与当前的 Google Maps 保持同步，但如果你找到了，那也可以。
【讨论】：