Angular UI Router：导航到嵌套视图时如何使父视图处于“活动”状态？

一尘不染

angularjs

我正在一个已实现UI路由器的ui-sref- active="active"项目中，当该项目是当前路线时，该项目用于将活动类添加到导航菜单项。但是，当您导航到该视图中的嵌套视图时，父菜单项不再处于活动状态。请参阅以下柱塞：

默认情况下（或者如果您单击它），路线1是“活动的”。当您单击“显示列表”时，您将看到Route 1不再处于活动状态。

编辑：

此示例与我的实际项目之间的唯一区别是，我的实际项目中的导航菜单具有其自己的控制器，因此不会使用与“ route1”的控制器相同的作用域。

阅读 188

2020-07-04

共1个答案

一尘不染

编辑对于更新的ui路由器0.2.13：

ui-sref-active="active"现在在当前状态为ui-sref的状态或任何子* 级时设置“活动”类 *

ui-sref-active-eq="active" 行为与ui-sref-active的先前迭代相同，并且仅将类设置为确切的状态

原始答案：

人们建议的一般解决方法是：

ng-class="{active:$state.includes('route1')}"

当然，必须将$ state添加到$ scope中。查看更新的插件：http
://plnkr.co/edit/KHLDJP? p=
preview

2020-07-04