Question

我有一个绑定到模型的textarea输入。我还有一个具有ng-change的选择，它会触发范围功能。当更改选择时，模型会更改。 ng-class上的函数将模型的原始值与当前值进行比较。添加的类用于为textarea的背景着色，使得当前值==原始值时，背景为白色。但这里有一些奇怪的事情。

案例1：

跑小提琴
在选择框中选择“2017-10-12”。 select背景变为绿色（按预期），但textarea背景仍为白色。

案例2：

跑小提琴
点击textarea并更改值。 textarea按预期变为绿色。键入原始值会导致textarea按预期变为白色。
在select框中选择“2017-10-12”。 select背景变为绿色，textarea变为绿色。（按预期）
在select框中选择“2017-11-01”。选择的背景变为白色，textarea也变为白色。（按预期）

为什么案例＃1不起作用？

请参阅jsFiddle

Answer 1

这是关于脏检查和你周围的CSS：

.form-control.ng-dirty.ng-valid, select.ng-dirty.ng-valid {
  background-color: $formDirtyValid;
}

.form-control.ng-dirty.ng-valid.nochange, select.ng-dirty.ng-valid.nochange {
  background-color: $formBack ;
}

更改输入后，输入元素将只有一个类“ng-dirty”。

你可以通过从所有css选择器中删除“.ng-dirty”类选择器来修复它，如下所示：

.form-control.ng-valid, select.ng-valid {
  background-color: $formDirtyValid;
}

.form-control.ng-valid.nochange, select.ng-valid.nochange {
  background-color: $formBack ;
}

https://jsfiddle.net/evmt2c56/15/

除非手动修改输入，否则为什么不评估ng-class？

1 个答案: