Ui-router gets the current state path for Google Analytics

Question

I am trying to get the state path to send to Google Analytics. There are some problems. I use abstract states, so using something like toState.url does not work, as it will not capture the entire URL.

I was thinking about using $ window.location.pathname in $ stateChangeSuccess, but it seems to succeed before the URL is updated in the browser. This means that pageviews are sent to 1 page too late. i.e.

click about: sends nothing click contact: sends about url click services: sends contact url 

Basically, the end result should look something like this, but with the URL toState or pathname:

 $rootScope.$on("$stateChangeStart", function(event, toState, toParams, fromState, fromParams) { var path = ???; ga('send', 'pageview', path); }); 

Answer 1

it looks like you need to use $ location instead to get a new path:

 $rootScope.$on("$stateChangeSuccess", function(event, toState, toParams, fromState, fromParams) { $window.ga('send', 'pageview', $location.path()); });