使用AngularJS有条件地更改CSS

Question

我正在尝试根据Angular表达式的值更改div的背景颜色。我有以下div：

<div class="outer">
  <h4 class="weather-heading">It's currently {{weather}}</h4>
</div>

根据{{weather}}的值（即晴天，阴天），我想更改外部div的背景颜色。使用angular进行此操作的最佳方法是什么？

Answer 1

正如@incutonez所说，你可以使用ng-class：

<div ng-class="{'sunny': weather == 'Sunny', 'rainy': weather == 'Rainy'}">
  <h4 class="weather-heading">It's currently {{weather}}</h4>
</div>

Plunker here。

根据你想要完成的任务，创建一个指令可能更合适，正如@Cherniv所建议的那样。