Angulartics and Google Analytics custom reports

Question

I am trying to send custom dimensions and metrics to Google Analytics via angulartics but the report failed everytime on a particular point.

I need to track the country, page, product name display (not on every pages) and some metrics as price etc.

Here is my code in my module and controller :

angular.module('app', [
    'ngAnimate', 'ngRoute', 'ngSanitize', 'angular-growl', 'angulartics', 'angulartics.google.analytics',
    'LocalForageModule', 'pascalprecht.translate'
]);

Here is my config :

app.config([
'$compileProvider', '$httpProvider', '$localForageProvider', '$routeProvider', '$translateProvider',
'$analyticsProvider', 'growlProvider',
function($compileProvider, $httpProvider, $localForageProvider, $routeProvider, $translateProvider, $analyticsProvider, growlProvider) {
    $compileProvider.debugInfoEnabled(configuration.angular.compileProvider.debugInfoEnabled);

    $analyticsProvider.virtualPageviews(false);

And here an example of a controller where I want to trace data

controllers.controller('ResultsController', [
'$localForage', '$scope', '$timeout', '$translate', '$analytics', '$rootScope', '$location', '$window',
function($localForage, $scope, $timeout, $translate, $analytics, $rootScope, $location, $window) {
    var logger = log4javascript.getLogger('Results');

$rootScope.$on('$routeChangeSuccess', function () {

        console.log('Route Changed: ' + $location.url());

        $window.ga('send', {
            'hitType': 'pageview',
            'dimension4' : '',
            'page' : $location.url()
        });
    });

this controller, associate to the results.html page, theoricaly send a dimension4 as null (dimension4 is the product name). This page display a product list and I have the user has to choose one.

The issue is when the user choose a product and goes to the products/id page.

$rootScope.$on('$routeChangeSuccess', function () {

      console.log('Route Changed: ' + $location.url());

      $window.ga('send', {
            'hitType': 'pageview',
            'dimension4' : data.product.upsPn,
            'page' : $location.url()
      });
 });

the route changed and at this point I want to send the product name (dimension4) that the user displayed.

When I am looking at the custom report on Google Analytics admin page, the page products/id is associate with the product name but if the user consulted the page /contact-us just after the /products/id, then my custom report would show a row with :

country code         page             product name
FR                   /products/id     TOTO56000
FR                   /contact-us      TOTO56000

Instead of :

country code         page             product name
FR                   /products/id     TOTO56000
FR                   /contact-us      

Is anyone have an Idea ? is it possible that the issue could came from $localforage ?

Answer 1

For those who need to do the same custom report here is my solution :

Remove $window, $rootScope and $location from DI
Remove the $rootScope.on and replace by

$analytics.pageTrack('/results');

    $analytics.setUserProperties({
        dimension3: '/results'          
    });

    $analytics.setUserProperties({
        dimension4: ' '         
    });

    $analytics.setUserProperties({
        metric1: 0      
    });

Just leave metric and dimension empty on pages you don't want to trace. It solved my issue