title: Angulartics and Google Analytics custom reports
body: <p>I am trying to send custom dimensions and metrics to Google Analytics via angulartics but the report failed everytime on a particular point. </p>
  
  <p>I need to track the country, page, product name display (not on every pages) and some metrics as price etc. </p>
  
  <p>Here is my code in my module and controller : </p>
  
  <pre><code>angular.module('app', [
      'ngAnimate', 'ngRoute', 'ngSanitize', 'angular-growl', 'angulartics', 'angulartics.google.analytics',
      'LocalForageModule', 'pascalprecht.translate'
  ]);
  </code></pre>
  
  <p>Here is my config : </p>
  
  <pre><code>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);
  </code></pre>
  
  <p>And here an example of a controller where I want to trace data</p>
  
  <pre><code>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()
          });
      });
  </code></pre>
  
  <p>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.</p>
  
  <p>The issue is when the user choose a product and goes to the products/id page. </p>
  
  <pre><code>$rootScope.$on('$routeChangeSuccess', function () {
  
        console.log('Route Changed: ' + $location.url());
  
        $window.ga('send', {
              'hitType': 'pageview',
              'dimension4' : data.product.upsPn,
              'page' : $location.url()
        });
   });
  </code></pre>
  
  <p>the route changed and at this point I want to send the product name (dimension4) that the user displayed. </p>
  
  <p>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 : </p>
  
  <pre><code>country code         page             product name
  FR                   /products/id     TOTO56000
  FR                   /contact-us      TOTO56000
  </code></pre>
  
  <p>Instead of : </p>
  
  <pre><code>country code         page             product name
  FR                   /products/id     TOTO56000
  FR                   /contact-us      
  </code></pre>
  
  <p>Is anyone have an Idea ? is it possible that the issue could came from $localforage ?    </p>