I am using Angulartics and Angulartics Google Analytics [1] to track user flow in an angular page. Tracking events works well. Also tracking pageviews is automatic and works. However in Google Analytics dashboard I can not see the anchor part of the url.
The tracking requests look like this:
https://www.google-analytics.com/collect?
v=1&_v=j51&a=333486222&t=screenview&_s=7&
cd=%2Findex.html%23%2Fsign-in&
dl=http%3A%2F%2Flocalhost%2Findex.html&
ul=de&de=UTF-8&
dt=Treat&
sd=24-bit&sr=1918x941&
vp=1918x845&je=0&
fl=25.0%20r0&an=Treats&_u=SACAAMABO~&jid=&
gjid=&cid=1883662174.1492999789&
uid=Mark-user&tid=UA-9675XXXX-1&z=124537179
Notice how the cd=%2Findex.html%23%2Fsign-in includes #sign-in part of the URI,
but the important dl=http%3A%2F%2Flocalhost%2Findex.html does not.
My app.js looks like this:
... }).config(function ($analyticsProvider) {
$analyticsProvider.firstPageview(true); /*Records pages that don't use $state or $route*/
$analyticsProvider.withAutoBase(true); /*Records full path*/
$analyticsProvider.virtualPageviews(true);
});
;
How can I track the full URI including the anchor for pageviews with Angulartics without resorting to manual trigger-code?
[1] https://github.com/angulartics/angulartics-google-analytics
[2] https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#location
I did work arround it by disabling the built-in page-views and tracking in the stateChangeSuccess event handler like this:
angular.module('starter', ['ionic', ... ,'angulartics',
'angulartics.google.analytics',
'angulartics.google.analytics.cordova','angulartics.mixpanel'])
.run(function($rootScope, $state, $analytics, $location){
$rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
// we do not use Angulartics virtual pageviews, instead we track them "manually" here because of
// https://github.com/angulartics/angulartics/issues/550
// also we track pageviews as events with the pageview path as event name to use the low cost plan of https://mixpanel.com/pricing/
var currentPath = $location.path();
$analytics.pageTrack(currentPath);
$analytics.eventTrack(currentPath, {category: 'pageview', label: 'pageview'});
});
});
The point is to call $analytics.pageTrack with location.path.
Works quite well! I also reported a bug on the project website.