Twitter bootstrap 使用字符串插值动态更改的ngClass

我需要用变量更改应用于div的类，但不是全部。在下面的示例中，我需要根据名为color的字符串更改一个类，因此我尝试了字符串插值。抛出错误，仅使用变量名不起作用。。。我该怎么做

<div [ngClass]="'progress-bar progress-bar-striped active {{color}}'" role="progressbar" [style.width]="progress">
</div>

---

您的变量位于静态字符串中，无法作为变量进行分析。 改用这个：

<div [ngClass]="'progress-bar progress-bar-striped active '+color" role="progressbar" [style.width]="progress">
</div>

请注意，活动类后面的空格和结束引号后面的+尝试以下语法：

<div class="progress-bar progress-bar-striped" [ngClass]="[color, size]" >...</div>

。。。

也试试这个

<div class="progress-bar progress-bar-striped" [className]="color">...</div>

。。。

color的值是类的名称吗？是的，它是一个长名称，会根据许多logicTemplate解析错误而更改：解析器错误：在表达式为ExpectedOps的位置获取插值（{{}），忘记删除{{}，因为这里不需要它们！不工作。没有语法错误，但未应用该类。如果颜色变量在开始时没有值，这是很正常的。当您希望color有值时，尝试将其值打印到控制台，然后输入元素以查看是否添加了该类。此外，color需要声明为css类color确实声明为css类，因为它是一个引导类，例如“进度条成功”。它与[ngClass]=“color”一起工作，但如果我需要使用多个变量怎么办。。。例如，我不能用[ngClass]=“颜色，大小”使其工作。你仍然可以使用newClass=“颜色大小”，然后使用[ngClass]=“newClass”或[ngClass]=“颜色，大小”太好了！我使用了您的上一个选项，并混合了像这样的常规类名[ngClass]=“['progress-bar'，'progress-bar striped'，color，size]”。谢谢，我很高兴它能起作用：）我仍然会把“静态”部分保留在课堂之外，而把它保留在“动态”部分