Setting Active links with UI-Router

ionic-v1
1

I know with ng-route, it was possible to set an active link based on the url but I’m not sure how this would work since the change to UI-Router.

So if I was on a page about “Cats” and I had a slide out menu, how would I highlight the Cats Item to show it was active.

Heres a plunker

2

Did you ever come up with a solution for this?

3

Ui-router has an active link tracker built into to it. For any links, I just add ui-active="activeClassName"

Then in my css

.activeClassName{
   /*Some style to reflect an active link*/

}
1 Like
4

it is ui-sref-active="ClassName"
see https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-sref-active

1 Like
5

Yup that’s it, I was typing it from memory, ha! A little off

6

ui-sref-active work fine in web view but it doesn’t work in mobile!!!