代码之家  ›  专栏  ›  技术社区  ›  Stefan Falk

加载google地图会中断css/样式表

  •  0
  • Stefan Falk  · 技术社区  · 6 年前

    我有一个简单的应用程序,使用谷歌地图。尤其是我在使用 AgmCoreModule 以及 places

    AgmCoreModule.forRoot({
      apiKey: '*********************',
      libraries: ['places']
    }),
    

    除了导航到加载模块的页面之外,一切都正常工作,我注意到我的样式表变得一团糟。像这样的事情

    <b>My text</b>
    

    只需导航到页面即可更改

    enter image description here

    enter image description here

    看起来字体也变了。

    你知道我怎样才能避免这种行为吗?


    更新:

    我注意到当我转到加载google地图的页面时,有一个GET请求 https://fonts.googleapis.com/css?family=Roboto:300,400,500,700

    有没有办法阻止谷歌地图这样做?

    1 回复  |  直到 6 年前
        1
  •  0
  •   Stefan Falk    6 年前

    这似乎是个众所周知的问题( https://github.com/SebastianM/angular-google-maps/issues/1466 ).

    <script>
        var head = document.getElementsByTagName('head')[0];
    
        // Save the original method
        var insertBefore = head.insertBefore;
    
        // Replace it!
        head.insertBefore = function (newElement, referenceElement) {
    
            if (newElement.href && newElement.href.indexOf('//fonts.googleapis.com/css?family=Roboto') > -1) {
    
                console.info('Prevented Roboto from loading!');
                return;
            }
    
            insertBefore.call(head, newElement, referenceElement);
        };
    </script>