feat(uiSrefActive): Also activate for child states.

[timkindberg]

feat(uiSrefActive): Also activate for child states.

To limit activation to target state use new ui-sref-active-equals directive'

Breaking Change: Since ui-sref-active now activates even when child states are active you may need to swap out your ui-sref-active with ui-sref-active-equals, thought typically we think devs want the auto inheritance.

Fixes #818

[timkindberg]

I actually still want to add the 'active-child' class too if its a child state that is active, so this is not fully ready yet. This picks up where #819 and #821 left off. Should be done by tomorrow.

[timkindberg]

Actually no I don't, I don't want to add bloat for no reason which I think I've been guilty of a little bit lately when helping people brainstorm. Let's just get this in and then if we find that people want a special class for when the directive is activated by a child state we'll add it in a new commit.

@nateabele, @MrOrz, please review this PR and let's merge it.

[MrOrz]

👍 good to go!

[spaceribs]

I get: "TypeError: Cannot read property 'name' of null" occuring on line 248 if you have an angular binding as the ui-sref:

<a ui-sref="{{ nav.name }}">{{ nav.label }}</a>

We should probably have a test in there for that.

[timkindberg]

@spaceribs ok thanks, will add that.

[timkindberg]

@spaceribs actually there are no tests for that functionality, I'm not sure it was ever expressly supported. Have you ever used interpolation in a ui-sref successfully?

[nateabele]

@spaceribs Yeah, that's not a thing.

@timkindberg I dig the functionality, but the directive name is still too verbose for me. What about this?

<a ui-sref="state" ui-sref-active="foo" ui-active-child="bar">...</a>

[timkindberg]

Well it would have to be named something else because ui-sref-active activates on child so the other one doesn't. I'll think some more too.

[spaceribs]

@nateabele @timkindberg I was able to use it before without an error, and it worked fine. Why wouldn't you want to be able to dynamically set the sref? is there a better way?

[timkindberg]

@spaceribs its not that I wouldn't want it, its just that it wasn't technically a supported feature and is out of scope for this issue. You can open a new feature request issue once this one is merged though.

[spaceribs]

@timkindberg Alright, thanks and sorry for throwing it in to this PR, kinda surprised it wasn't one of the tests already.

[timkindberg]

@nateabele so I think it still needs to say ui-sref-active in the name because its literally the same thing. How about ui-sref-active-is?

[timkindberg]

@nateabele Ok I shortened it to ui-sref-active-eq. Can we meet in the middle on that name? I think it important to maintain the 'ui-sref-active' portion of the name.

[treymack]

Ya. Googlability.
On Mar 9, 2014 8:26 PM, "Tim Kindberg" [email protected] wrote:

@nateabele https://github.com/nateabele Ok I shortened it to
ui-sref-active-eq. Can we meet in the middle on that name? I think it
important to maintain the 'ui-sref-active' portion of the name.

Reply to this email directly or view it on GitHubhttps://github.com//pull/927#issuecomment-37145298
.

[MrOrz]

👍 for keeping ui-sref-active- prefix

[techniq]

I saw 0.2.10 was just released, which didn't include this change. Any idea how long till 0.2.11 is tagged? I tried to bower install sha #5a7c48ca08 but ran into some issues.

[timkindberg]

@techniq ouch, yeah... so releases have typically been taking a month. You could cherry pick and build locally.

[techniq]

@timkindberg - thanks. might just be an issue with my build system. I'll try to re-pull again. I kind of figured the release window was around then, which is why I asked.

[techniq]

@timkindberg - I figured out why I wasn't seeing the change even after specifying angular-ui-router's version in package.json to the SHA #5a7c48ca08. I'm using the gulp plugin gulp-bower-files which reads each bower_component's bower.json's main property, and I take each of those scripts and concat / minify. angular-ui-router's main is set to ./release/angular-ui-router.js, which is only rebuild for each release.

[techniq]

@timkindberg - FYI, I got around the main issue by setting an override in my bower.json for angular-ui. For example

    "overrides": {
        "angular-ui-router": {
            "main": "src/*.js"
        }
    }

[timkindberg]

@techniq ah cool thanks.

[corydorning]

There are several issues opened for this functionality. Which one should I be following?

Also what's the proper implementation and timeline for release? Thanks!

[thillai]

@nateabele when can we expect version 0.3 with this fix?

[alesvaupotic]

+1 for this one. Hate to maintain a local copy of such a basic feature on a project. Fingers crossed for quick release.

[wcandillon]

+1. Looking forward to new release.

[manuel-woelker]

+1. Jumping on the bandwagon and eagerly awaiting the next release

[gregwym]

+1. Really need this feature. Looking forward to new release.

[vik-singh]

+1

[tlrjs]

+1

[island205]

+1

[lrodziewicz]

+1

[byeval]

+1024

[derek-watson]

[srph]

+1 👍

[timkindberg]

Do you guys want this feature?

[sjmorrow]

+(everyone who uses ui-router)

[byeval]

@timkindberg yes! i really don't want to use ng-class and $state.includes() to obtain the class.

[gregwym]

+10086
The 0.3.0 milestone is past due by 3 month. lol.

[quanghoc]

+1

[mike-marcacci]

+1

[mike-marcacci]

@timkindberg does this PR still fix this issue? I can't get it to work in my builds, and it doesn't look like the test (at least from the PR's commit) actually tests successful activation of when on a child route. Perhaps I'm missing something?

[ghost]

+1

[petrkotek]

As there is still no official build including this functionality, I forked ui-router and did own release in my fork: https://github.com/bc-petrkotek/ui-router/tree/0.2.11-beta

You can do the same or use my one by adding following line in your bower.json:

"angular-ui-router": "[email protected]:bc-petrkotek/ui-router.git#0.2.11-beta".

[Fingel]

Wasted a bunch of time assuming this was the default implementation to begin with...
+1

[timkindberg]

@WD-42 sorry man

@mike-marcacci actually I think we realized this only activates for the current and immediate child ui-sref. We'll have to add another PR for all descendant ui-srefs... :(

[kaiku]

Great work on ui-router, a big +1 for this useful feature

[nerdburn]

Awesome, this works for me in 0.2.11, thanks.

[fxck]

Is it gonna cover this case?

I have a link in menu that points to app.something.list(), but I want it to be active even when I'm on app.something.detail().. app.something is an abstract state.

[maciej-gurban]

+1 for what @fxck suggests.

[wcandillon]

@fxck @maciej-gurban I've made a proposal for this at #1254 What do you think?

[fxck]

I'd say this should be opt out rather than opt in, and if opt in, then not by explicitly naming the states. What you proposed is basically the same as using ngclass..

[uguryilmaz]

+1