Um Google Analytics in eine Angular App einzubinden muss man genau zwei Dinge tun:
- Den Google Analytics Code im body-Bereich der index.html Datei einbinden UND die Zeile ga(’send‘, ‚pageview‘); herauslöschen (diese muss manuell gesendet werden)
- In der root-Komponente auf Änderungen im Router lauschen um dann entsprechend ga(’send‘, ‚pageview‘); aufzurufen
Lauschen auf Änderungen im Router:
ngOnInit() {
this.routerEventSubscriber = this.router.events.subscribe((event) => {
if (!(event instanceof NavigationEnd)) {
return;
}
// Inform Google Analytics
ga('set', 'page', event.urlAfterRedirects);
ga('send', 'pageview');
});
}
ngOnDestroy() {
this.routerEventSubscriber.unsubscribe();
}
[Update]
Wenn man die Analytics-Daten nur in der Produktiv-Umgebung abfeuern möchte, kann man das am besten über die environment-Variable machen:
if( environment.production === true ) {
// Inform Google Analytics
ga('set', 'page', event.urlAfterRedirects);
ga('send', 'pageview');
}