如何检测指令中的当前状态

Question

我正在使用AngularUI的路由,我想做一个,ng-class="{active: current.state}"但我不确定如何在这样的指令中准确检测当前状态.

Answer 1

更新:

这个答案适用于Ui-Router的旧版本.对于最新版本(0.2.5+),请使用helper指令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')}"

Answer 2

您也可以使用ui-sref-active指令:

<ul>
  <li ui-sref-active="active" class="item">
    <a href ui-sref="app.user({user: 'bilbobaggins'})">@bilbobaggins</a>
  </li>
  <!-- ... -->
</ul>

或过滤器: "stateName" | isState&"stateName" | includedByState

Answer 3

如果您使用的是ui-router,请尝试$ state.is();

您可以像这样使用它:

$state.is('stateName');

文档