Created
May 24, 2019 18:33
-
-
Save loicgasser/26e22c9a3912c093f6bd53ba252d12c9 to your computer and use it in GitHub Desktop.
Disable the loading of Google Font when loading Google Map API
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Directive } from '@angular/core'; | |
@Directive({ | |
selector: '[appGoogleFontsLoadingDisable]' | |
}) | |
export class GoogleFontsLoadingDisableDirective { | |
constructor() { | |
const head = document.getElementsByTagName('head')[0] as any; | |
const insertBefore = head.insertBefore; | |
head.insertBefore = function (newElement: any, referenceElement: any) { | |
if (newElement.href && newElement.href.indexOf('//fonts.googleapis.com/css?family=Roboto') > -1) { | |
return; | |
} | |
insertBefore.call(head, newElement, referenceElement); | |
}; | |
} | |
} |
In case you don't like "any" in your code, here's a more typed version:
import { Directive } from "@angular/core";
@Directive({
selector: "[appGoogleFontsLoadingDisable]",
})
export class GoogleFontsLoadingDisableDirective {
constructor() {
const head = document.getElementsByTagName("head")[0];
const insertBefore = head.insertBefore;
head.insertBefore = function (newElement: Node, referenceElement: Node) {
const newHTMLLinkElement = newElement as HTMLLinkElement;
if (newHTMLLinkElement.href && newHTMLLinkElement.href.indexOf("//fonts.googleapis.com/") > -1) {
return null;
}
insertBefore.call(head, newElement, referenceElement);
};
}
}
Then add the appGoogleFontsLoadingDisable to your google-map tag like so:
<google-map appGoogleFontsLoadingDisable [height]="'100%'" [width]="'100%'" [options]="options">
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks!