angularjs - 在 "ng-style"迭代中使用 AngularJs "ng-repeat"

Question

我尝试使用 ng-style 根据数据元素的值有条件地设置表中数据元素的颜色。每行数据都是使用 ng Repeat 生成的。

所以我有类似的东西:

<tr ng-repeat="payment in payments">
  <td ng-style="set_color({{payment}})">{{payment.number}}</td>

我的 Controller 中的一个函数执行以下操作:

$scope.set_color = function (payment) {
  if (payment.number > 50) {
    return '{color: red}'
  }
}

我尝试了几种不同的方法。甚至将颜色设置为支付对象中的数据属性，但是似乎我无法让 ng-style 来处理来自数据绑定(bind)的数据， 有谁知道我可以做这个工作的方法吗？谢谢。

Answer 1

不要在 Angular expression 中使用 {{}} :

<td ng-style="set_color(payment)">{{payment.number}}</td>

从函数返回一个对象，而不是字符串:

$scope.set_color = function (payment) {
  if (payment.number > 50) {
    return { color: "red" }
  }
}

Fiddle