Angular's ng类未更新，而正在评估的值为

Angular's ng-class is not updating while the value being evaluated is

本文关键字：评估 更新 ng Angular      更新时间：2023-09-26

所以，我不知道这里发生了什么。这要么是一个极其明显的误解，要么是ui路由器和ng类之间的bug。我的模板如下（使用Jade语法）：

button.back(ng-class="{ 'hidden':  {{'index.blog.article' | isState}}    }") back ){{'index.blog.article' | isState}})

在实时视图中，当状态"index.blog.article"未激活时，您会看到：

<button ng-class="{ 'hidden':  false }" class="back ng-binding"> back false</button>

正如你所料。但是，当状态为活动时，您会看到：

<button ng-class="{ 'hidden':  true }" class="back ng-binding"> back true</button>

只是这个类实际上并没有改变。所以，模板中的值会被更新，但ng类不会被评估？什么东西？

由于某些原因，我不能100%确定原因，但<button>标记不会更新类，<input type="button">也不会。围绕这一点的工作是用绑定到的任何东西（如）来声明类

<button ng-class="{ hidden: true, unHidden: false }" class="{{ index.blog.article }}" />

JSFiddle

*检查第一个按钮，您将看到类更改

您可以使用

ng-class="isState('article')?'hidden':''"

或

ng-class="{'hidden':isState('article')}"

isState是作用域上的一个函数，将$state.current.name与param进行比较并返回true或false

看看我的jsfiddle，它和按钮一起工作http://jsfiddle.net/5aj4qy81/或http://jsfiddle.net/5aj4qy81/1/

编辑下一个解决方案也适用，如果您的后退按钮在控制器之外，只需意识到ui路由器具有此功能isState调用它"is"即可。

因此，您可以将$state添加到$rootScope

angular.module('myApp').run(function ($rootScope, $state, $stateParams) {
 $rootScope.$state = $state;
 $rootScope.$stateParams = $stateParams;

})；

然后在你的后退按钮中使用

ng-class="{'hidden':$state.is('article')}"

http://jsfiddle.net/5aj4qy81/3/

是否尝试删除单引号？所以你的代码应该是这样的：

<div ng-class="{ hidden: true }" ...> back true</div>
相关文章：