Site navigation using ui-sref, how to remove ui-sref attribute when not available
angular-ui-router, angularjs, angularjs-routing, routes, ui-sref
Solution
You could use `{{}}` with expression
Markup
ui-sref="{{expression ? '.childState' : '.'}}"
`.` will create own state route, so while click on it, it will redirect no where.
Hope this could help you, Thanks.
Problem
I've setup navigation as follows, using ng-repeat, which works very well ``` <a ui-sref="{{link.Route}}" ng-click="clickLink(link)"> <span class="title"> {{link.Text}} </span><span class="selected"></span> </a> ``` However, my navigation items frequently have sublinks, which means the parent link isn't really a navigation link, it's just used to expand and view the sublinks. But sometime it is a link, and has no sublinks to display. The problem is for those particular cases, when there is no state available, I need to remove the ui-sref all together, because there shouldn't be a link at all. Having it there is throwing 'Error: Invalid state ref ''' How do I remove the ui-sref when a state isn't available?