如何在Angular2中實現Google Analytics？

我在嘗試在angular2中實施谷歌分析時遇到了問題。根據我找到的信息和例子，在this post看起來很容易。但到目前爲止，我沒有找到任何示例如何做，而不是從.html，而是從.ts。如何在Angular2中實現Google Analytics？

我想用谷歌分析一個私人的方法，然後在構造函數中調用它。類似的東西。

constructor() { 
    this.initializeAnalytics(); 
} 

private initializeAnalytics() { 
    (function (i, s, o, g, r, a, m) { 
     i['GoogleAnalyticsObject'] = r; 
     i[r] = i[r] || function() { 
      (i[r].q = i[r].q || []).push(arguments) 
     }, i[r].l = 1 * new Date(); 
     a = s.createElement(o), 
       m = s.getElementsByTagName(o)[0]; 
     a.async = 1; 
     a.src = g; 
     m.parentNode.insertBefore(a, m) 
    })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga'); 

    ... 
    ... 
}

但只是放置谷歌分析代碼不起作用（錯誤：supplied parameters do not match any signature of call target）。我可能是以錯誤的方式來做。

我該如何做到這一點？

來源

2016-11-21 Olegs Jasjko

這就是我做到的。

您需要將ga代碼放入index.html。（不要忘記評論以下行：// ga（'send'，'pageview'）;）

然後，您需要在導入之後將ga函數聲明到app.component.ts文件中：

import { ... } ...; 

declare var ga:Function; 

@component(...)

然後，你可以訂閱你app.component.ts路由變化事件，併發送GA的數據是這樣的：

this.router.events.subscribe((event:Event) => { 
    // Send GA tracking on NavigationEnd event. You may wish to add other 
    // logic here too or change which event to work with 
    if (event instanceof NavigationEnd) { 
     // When the route is '/', location.path actually returns ''. 
     let newRoute = this.location.path() || '/'; 
     // If the route has changed, send the new route to analytics. 
     if (this.currentRoute != newRoute) { 
      ga('send', 'pageview', newRoute); 
      //console.log('would send to ga: ' + newRoute); 
      this.currentRoute = newRoute; 
     } 
    } 
});

來源

2016-11-21 11:19:49 Ploppy

感謝的答案，但是這正是我發現同樣的事情（錶鏈接的URL） –

您需要的代碼轉換打字稿。目前它是Javascript。在

function (i, s, o, g, r, a, m)

函數有7個非可選參數，但是你只在這一行提供5：

(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga')

你需要做的其餘參數可選，像這樣：

function (i, s, o, g, r, a?, m?)

然後，您還需要更改不同的行：

}, i[r].l = 1 * new Date();

到

}, i[r].l = 1 * <any>new Date();

最後的代碼看起來是這樣的：

(function (i, s, o, g, r, a?, m?) { 
    i['GoogleAnalyticsObject'] = r; 
    i[r] = i[r] || function() { 
      (i[r].q = i[r].q || []).push(arguments) 
     }, i[r].l = 1 * <any>new Date(); 
    a = s.createElement(o), 
     m = s.getElementsByTagName(o)[0]; 
    a.async = 1; 
    a.src = g; 
    m.parentNode.insertBefore(a, m) 
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');

來源

2017-02-11 12:28:28 Smaug

如何在Angular2中實現Google Analytics？

回答

相關問題