{"action":"created","issue":{"url":"https://api.github.com/repos/angular-ui/ui-router/issues/1527","labels_url":"https://api.github.com/repos/angular-ui/ui-router/issues/1527/labels{/name}","comments_url":"https://api.github.com/repos/angular-ui/ui-router/issues/1527/comments","events_url":"https://api.github.com/repos/angular-ui/ui-router/issues/1527/events","html_url":"https://github.com/angular-ui/ui-router/issues/1527","id":48465932,"number":1527,"title":"uiSrefActive, substate highlighting with abastract states","user":{"login":"mugenkanosei","id":1936530,"avatar_url":"https://avatars.githubusercontent.com/u/1936530?v=3","gravatar_id":"","url":"https://api.github.com/users/mugenkanosei","html_url":"https://github.com/mugenkanosei","followers_url":"https://api.github.com/users/mugenkanosei/followers","following_url":"https://api.github.com/users/mugenkanosei/following{/other_user}","gists_url":"https://api.github.com/users/mugenkanosei/gists{/gist_id}","starred_url":"https://api.github.com/users/mugenkanosei/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mugenkanosei/subscriptions","organizations_url":"https://api.github.com/users/mugenkanosei/orgs","repos_url":"https://api.github.com/users/mugenkanosei/repos","events_url":"https://api.github.com/users/mugenkanosei/events{/privacy}","received_events_url":"https://api.github.com/users/mugenkanosei/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2014-11-12T02:43:28Z","updated_at":"2015-11-22T17:28:03Z","closed_at":"2014-11-12T03:23:43Z","body":"I know uiSrefActive was changed to support substates with #819, but I don't think it is working with a root abstract state. I'm new to UI Router, so this could just be my lack of experience.\r\n\r\nI have a view (reporting.html) with a nested view that I wanted to go to a default page (reporting.default.html) on first load. Looking at the docs and the contact example app, I created an abstract state with two substates.\r\n\r\n```javascript\r\n.state('reporting',\r\n{\r\n    url: '/reporting',\r\n    abstract: true,\r\n    templateUrl: 'angular/app/reporting/reporting.html'\r\n})\r\n\r\n.state('reporting.default',\r\n{\r\n    url: '',\r\n    templateUrl: 'angular/app/reporting/reporting.default.html'\r\n})\r\n\r\n.state('reporting.style1',\r\n{\r\n    url: '/report/{reportId}',\r\n    templateUrl: 'angular/app/reporting/report.style1.html'\r\n})\r\n```\r\n\r\nI have a nav bar with a link like this\r\n```html\r\n<li data-ui-sref-active=\"active\">\r\n    <a data-ui-sref=\"reporting.default\">Reporting</a>\r\n</li>\r\n```\r\nIn the reporting.html page, there is a sidenav to select from a list of reports and a nested ui-view.\r\n\r\nWhen I click on the top nav to go to reporting, the link becomes active and it routes to the default view as I want, but when I click on a link in the sidenav to select a specific report, the topnav link becomes deactivated. I assume this is because the state is now \"reporting.style1\" and the uiSrefActive is using \"reporting.default\", but if I change the `data-ui-sref` to just \"reporting\", the activation functionality works with \"reporting.style1\" when I manually navigate, but the top nav link no longer works.\r\n\r\nEdit:\r\nFound that I could use $state.includes('reporting.*') within an ngClass which works nicely."},"comment":{"url":"https://api.github.com/repos/angular-ui/ui-router/issues/comments/158779807","html_url":"https://github.com/angular-ui/ui-router/issues/1527#issuecomment-158779807","issue_url":"https://api.github.com/repos/angular-ui/ui-router/issues/1527","id":158779807,"user":{"login":"pandeysoni","id":7939709,"avatar_url":"https://avatars.githubusercontent.com/u/7939709?v=3","gravatar_id":"","url":"https://api.github.com/users/pandeysoni","html_url":"https://github.com/pandeysoni","followers_url":"https://api.github.com/users/pandeysoni/followers","following_url":"https://api.github.com/users/pandeysoni/following{/other_user}","gists_url":"https://api.github.com/users/pandeysoni/gists{/gist_id}","starred_url":"https://api.github.com/users/pandeysoni/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/pandeysoni/subscriptions","organizations_url":"https://api.github.com/users/pandeysoni/orgs","repos_url":"https://api.github.com/users/pandeysoni/repos","events_url":"https://api.github.com/users/pandeysoni/events{/privacy}","received_events_url":"https://api.github.com/users/pandeysoni/received_events","type":"User","site_admin":false},"created_at":"2015-11-22T17:28:03Z","updated_at":"2015-11-22T17:28:03Z","body":"Hey, I am new to UI-router and I am stuck with same issue, can you please let me know proper solution i added $state.includes in ng-class, but still not working, shall i need to add any other thing.\r\n\r\nThanks in advance"}}