Question

我正在尝试使用组件中的数组生成此列表：

  billChecklist = [
    {
      title: "mortgage",
      every: "1st",
      amount: "$1300",
      status: "paid"
    }];

我的HTML有一个For LET循环，工作正常：

<tbody *ngFor="let bills of billChecklist">
    <tr>
       <td>{{bills.every}}</td>
       <td>{{bills.title}}</td>
       <td>{{bills.amount}}</td>
       <td><span class="glyphicon" [ngClass]="{'glyphicon-ok': bills.status==='paid'}" aria-hidden="true"></span></td>
    </tr>
</tbody>

在最后，我有一个跨度，我想把“glyphicon-ok”放在上面的数组中。

我尝试过做一个条件ngClass，但是在使用数组变量{{bills.paid}}时出现错误，或者在使用下面那个时没有任何错误。

[ngClass]="{'glyphicon-ok': bills.status==='paid'}"

任何帮助将不胜感激。

Answer 1

您可以将课程设置如下：

> <div [class.extra-sparkle]="isDelightful">   Binds the presence of the
> CSS class extra-sparkle on the element to the truthiness of the
> expression isDelightful.

查看更多here 和

sparse_tensor_dense_matmul

来自here

Answer 2

你也可以做一个完整的三元条件

<span [ngClass]="{bills.status==='paid' ? 'glyphicon-ok' : 'glyphicon-other'}"></span>

Angular 2 - 基于数组字符串添加类？

2 个答案: