Tracking Google Analytics Page Views with AngularJS

google-analytics angularjs
dj2 picture dj2 · May 23, 2012 · Viewed 115.8k times · Source

I'm setting up a new app using AngularJS as the frontend. Everything on the client side is done with HTML5 pushstate and I'd like to be able to track my page views in Google Analytics.

Answer

dj2 picture dj2 · May 23, 2012

If you're using ng-view in your Angular app you can listen for the $viewContentLoaded event and push a tracking event to Google Analytics.

Assuming you've set up your tracking code in your main index.html file with a name of var _gaq and MyCtrl is what you've defined in the ng-controller directive.

function MyCtrl($scope, $location, $window) {
  $scope.$on('$viewContentLoaded', function(event) {
    $window._gaq.push(['_trackPageView', $location.url()]);
  });
}

UPDATE: for new version of google-analytics use this one

function MyCtrl($scope, $location, $window) {
  $scope.$on('$viewContentLoaded', function(event) {
    $window.ga('send', 'pageview', { page: $location.url() });
  });
}

Related questions

Google Tag Manager with AngularJS?

How do I use GTM with Angular? I'm trying to fire a (virtual) pageview event when I load a new partial using this code: dataLayer.push({ 'event' : 'pageview', 'pageview' : $location.path(), 'virtualUrl' : $location.path() }); But I don't see the event …

Read More
No matching client found for package name (Google Analytics) - multiple productFlavors & buildTypes

Context: I'm trying to set up Google Analytics for my app. (having 4 custom buildTypes and more than a few productFlavors) It works fine when I select the Build Variant which has the applicationId set to com.my.app.package.name (…

Read More
How to remove a web site from google analytics

I am Administrator of several web sites on google analytics. Can i delete some of them? If yes, how? Many of you suggested me to remove my profile. So my doubts are: 1. I am administrator of several items. I want …

Read More