How can I get the full url of the current ui-router state?

Question

I'm using ui-router for AngularJS; I'm handling the '$stateChangeSuccess' event, and trying to get the full path (after '#') for the current state. $location.hash() returns an empty string and $state.url returns only the portion of the path that applies to the nested state.

My full path #/a/b

$state.url == "/b"
$locadtion.hash() == ""

How can I get #/a/b or /a/b?

Solution 1

You can always use:

window.location 

or:

window.location.hash 

(if that's what you want).

Solution 2

Have you tried $location.url()? That should include the hash. Actually, my test reveals that it doesn't grab the hash.

$location docs

As an aside, you may want to look into setting html5Mode in $locationProvider.

Solution 3

You should listen to the $locationChangeSuccess event.

There you can use $location.path() or window.location.hash depending on your needs.

Comments

[Trevor]

Does html5Mode help with the solution, or is it just a better practice? If so, what's the advantage?

[jsplaine]

This stackoverflow answer explains what it does and why it may matter better than I could.

[jsplaine]

To better answer your question, the reason I used it was to get rid of the # appearing in the url bar.