如何检测指令中的当前状态
我使用AngularUI的路由,我想做一个ng-class="{active: current.state}"
但我不确定如何在这样的指令中精确检测当前状态。
你也可以使用ui-sref-active指令:
<ul> <li ui-sref-active="active" class="item"> <a href ui-sref="app.user({user: 'bilbobaggins'})">@bilbobaggins</a> </li> <!-- ... --> </ul>
或filter: "stateName" | isState
"stateName" | isState
& "stateName" | includedByState
"stateName" | includedByState
更新:
这个答案是Ui-Router的一个老版本。 对于更新的版本(0.2.5+),请使用助手指令ui-sref-active
。 详情在这里 。
原始答案:
将$ state服务包含在您的控制器中。 您可以将此服务分配给您的范围内的某个属性。
一个例子:
$scope.$state = $state;
然后在模板中获取当前状态:
$state.current.name
要检查一个状态是否当前有效:
$state.includes('stateName');
如果包含状态,则此方法返回true,即使它是嵌套状态的一部分。 如果你处于嵌套状态, user.details
,并且你检查了$state.includes('user')
,它会返回true。
在你的类例子中,你可以这样做:
ng-class="{active: $state.includes('stateName')}"
如果你使用ui-router,试试$ state.is();
你可以这样使用它:
$state.is('stateName');
文档
检查angular-ui,特别是路由检查: http : //angular-ui.github.io/ui-utils/
用于我的ui-sref-active指令的使用是:
<li ui-sref-active="{'active': 'admin'}"> <a ui-sref="admin.users">Administration Panel</a> </li>
如标题为“tgrant59评论于2016年5月31日”的评论所示。
我正在使用angular-ui-router v0.3.1。
- Angular / UI路由器 – 如何更新url而不刷新所有内容?
- 如何实现“ui-sref”被有条件地执行?
- 使用UI-Router设置页面标题
- 无法parsing“…”状态
- Angular UI-Router $ urlRouterProvider .when不工作*不再*
- 将$ state(ui-router)注入$ http拦截器会导致循环依赖
- 如何使用$ state.go发送和检索参数toParams和$ stateParams?
- 使用ui-router显示404错误页面时如何更改url
- Angular UI路由器中的$ state.transitionTo()和$ state.go()之间的区别