根据当前状态向 ui-view 添加一个类 [英] add a class to the ui-view based on the current state

问题描述

在 AngularJS (1.2.7) 项目中，使用 UI Router (0.2.8)，我想将当前状态作为一个类应用于 ui-view 元素，因为这将允许我为特定状态应用动画，例如从登录到开始执行转换 A，从开始到设置执行转换 B.

目前我在 $rootScope 上有 $state 对象(如 提到这里，它允许我使用 ng-class="$state.current.name" 在主体上添加一个基于状态的类.但是，如果我将它添加到 ui-view 元素，例如

那么该类比实际状态落后一步.所以当从登录"到开始"时，类将是登录"而不是开始".

解决方案

我认为这是一个错误，您可以在此处阅读有关该问题的更多信息:

https://github.com/angular-ui/ui-router/issues/866

在修复之前，我建议采用这样的解决方法:

<div ng-class="$state.current.name"><div ui-view></div></div>

In a AngularJS (1.2.7) project, using UI Router (0.2.8), I want to apply the current state as a class to the ui-view element, because that would allow me to apply animations for specific states, e.g. do transition A going from login to start and do transition B going from start to settings.

At the moment I have the $state object on the $rootScope (as mentioned here, which allows me to add a state-based class on the body using ng-class="$state.current.name". However, if I add that to the ui-view element, e.g.

<div ui-view ng-class="$state.current.name"></div>

Then the class is one step behind the actual state. So when going from "login" to "start", the class will be "login" instead of "start".

解决方案

I think this is a bug, you can read more about the issue here:

https://github.com/angular-ui/ui-router/issues/866

Until it is fixed I suggest such a workaround:

<div ng-class="$state.current.name"><div ui-view></div></div>

这篇关于根据当前状态向 ui-view 添加一个类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！