Question

我正在尝试解决如何实现这一目标。我有一个在ngFor循环中生成的按钮组：

<div class="btn-group float-right">
    <button *ngFor="let frequency of mapping?.frequency_mapping" [ngClass]="[profile?.frequency_name == frequency.label ? 'btn-success' : 'btn-outline-secondary']" type="button" value="{{ frequency.pk}}" class="btn">{{ frequency.label }}</button>
</div>

我添加按钮的文本，我想根据此按钮frequency.label

的值插入一个类

这样的事情：

if frequency.label = condition A then class = classA
else if frequency.label = condition B then class = classB
else if frequency.label = condition C then class = classB

实现这一目标的最佳方法是什么？

基本上我需要最终结果是

<button><i class="fa fa-classA"></i>{{ frequency.label }}</button>
<button><i class="fa fa-classB"></i>{{ frequency.label }}</button>
<button><i class="fa fa-classC"></i>{{ frequency.label }}</button>

Answer 1

我相信你只是在ngClass上使用了错误的格式。摆脱[]括号。

看看here

您正在寻找的案例场景是“如何使用”部分的第4个示例。你需要它来评估一个表达式。

通过使用括号，ngClass将期望样式的静态字符串数组，它不会计算表达式。

在具有多个条件的循环中使用if / else

1 个答案: