Refer to current state from ui-sref (e.g. for setting url parameters).

[olegskl]

The documentation explicitly states "You can also use relative state paths within ui-sref, just like the relative paths passed to $state.go()." However, even though we are able to refer to the current state with $state.go('.', {foo: 'bar'}) it doesn't seem to work when using ui-sref directive. I naively tried ui-sref=".({foo:'bar'})" which failed.

Of course it is possible to wire up ng-click and $state.go, but that leaves us with href-less anchors, which is not very useful from the user perspective.

I've ventured a related question on stackoverflow in case somebody had figured it out already. But it appears not to be the case.

Does this functionality exist already (maybe I just missed/misused it)? If not, should it be implemented?

[timkindberg]

I'll be honest, we never expected the use of just a single dot (.). I'm pretty sure you can just do this though now ui-sref="{foo:'bar'}".

[olegskl]

I tried <a ui-sref="{foo:'bar'}">foobar</a> too and it gave me:

Error: Could not resolve '{foo:'bar'}' from state ''

Setting up a breakpoint inside of $state.go reveals that it is called like so:

$state.go("{foo:'bar'}", null, ...)

And then the error is thrown inside $state.transitionTo, on L785. I'm using v0.2.10.

[timkindberg]

Hmm here's the commit that added that feature.

71cad3d

[olegskl]

Indeed, it's not in the 0.2.10 yet. I have cloned the master branch, built it and took the files from the "build" folder. And now <a ui-sref="{foo:'bar'}">foobar</a> works fine when I put it inside a ui-view partial, though it doesn't get updated when the current state changes (I guess I was hoping for too many things at once...).

However, if put it outside of ui-view (but still inside of ng-app of course), no matter the url, on page load I'm getting:

Error: Invalid state ref '({foo:'bar'})'

So, when the directive is outside of a ui-view, the $state.current.name in $StateRefDirective's link function is always an empty string when activating a state by navigating to a url. Thus, no href attribute is created when page is rendered.

It could be intended/unavoidable behaviour though, I'm not sure.

[timkindberg]

Thanks for looking into it. Hopefully we'll take a look soon.

[czebe]

We're also missing this feature. Currently there's no clean way to link back to the current state without query parameters (remove parameters and trigger state change).

[lunow]

+1

[daviddeutsch]

I can confirm that this works in 0.2.11 - no more error. However, it seems like the page is still reloaded.

[thomastuts]

I just tried this out and while it works perfectly when you load the page, if I change a state (e.g. from 'dashboard' to 'explore'), it still tries to redirect the user to dashboard/5 instead of explore/5 when I hover over a link. It's like the ui-sref doesn't update the state it needs to redirect to (i.e. the current state). Any ideas on why this is?

[albertpeiro]

+1 on this. Pretty pressing for handling user-friendly async pagination.

[jaroslavrehorka]

+1

[demisx]

+1

[bennewton999]

+1

[zschiffelbein]

+1 using ui-sref="{foo: 'bar'}" renders the href tag on the first state and does not continue to update on state changes.

edit: Spoke too soon. I got this to work. Remove the ui-sref tag and add ng-click="$state.go('.', {foo: 'bar'})". Hope this helps.

[nateabele]

Okay, so sounds like maybe the $watch() is wrong. If somebody can post me up a quick Plunkr I'll take a look at it.