css - 你能用 AngularJS 做条件格式化吗？

Question

我有一个包含来 self 的 Controller 的值的元素:

<span>[[myvalue]]</span>

我会根据值更改背景颜色。例如，值 1-5 应为红色，6-10 应为绿色。

<span style='background-color: #green'>9</span>
<span style='background-color: #red'>1</span>

实现此目标的最简单方法是什么？

Answer 1

正如 tymeJV 提到的 ngStyle 你也可以使用 ngClass

<span ng-class="{'myClass' : (myValue < 9)}">{{myValue}}</span>

此外，为了促进一些单元测试，我还建议将逻辑放入一个函数中，这样您就可以轻松地进行测试，因为它还可以使标记更易于阅读。

标记

<span ng-class="{'myClass' : isSpecial(myValue)}">{{myValue}}</span>

Controller

$scope.isSpecial = function(value){ return myValue < 9};

虽然我的例子和你的例子有点做作，但可以帮助以后更容易维护。