如何根据内容更改元素的类？答案

【问题标题】：How to change element's class depending on it's content?如何根据内容更改元素的类？
【发布时间】：2018-06-01 17:18:52
【问题描述】：

我有一个 Angular 2 项目，我想根据其内容更改元素的类。所以，我有一个带有{{item}} 元素的模板，以及一个具有多种样式的 .css 文件，具体取决于元素的类。我想要做的是，根据{{item}} 的值更改 的类。例如，如果item=2 其类将等于c1，但如果item 的值更改为4，则它将具有class = "c2"。

【问题讨论】：

一个开关函数来根据每个案例定义类？
是的，这是怎么做到的？

标签： html css angular angular2-template

【解决方案1】：

您可以对每种情况使用 if else 语句，也可以对每种情况使用 switch 函数。

if(item === '2') {
  return <span class="c1">{{item}}</span>
} else if(item === '4') {
  return <span class="c2">{{item}}</span>
}

&lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"&gt;&lt;/script&gt;

【讨论】：

【解决方案2】：

{{item}}

【讨论】：