angular - 在 Angular2 中如何仅将类添加到第一行

Question

我想根据某些条件添加一个 css 类。

在下面的代码中，我想将 RowHeaderCSS 类添加到表格的第一行，但它确实有效。谁能帮我解决这个问题？

<tr *ngFor="let dataObject of dataCollection;let isFirstRow=(index==1?true:false)" [ngClass]="{'RowHeaderCSS':isFirstRow)}">
        <td scope="row">{{dataObject.SNO}}</td>
        <td Overdue-Bucket-Template>{{dataObject.MONTH01}}</td>
        <td Overdue-Bucket-Template>{{dataObject.MONTH02}}</td>
</tr>

Answer 1

Angular 有一个局部变量 first 用于所有 ngFor 循环，它会做你想做的事情

<tr *ngFor="let dataObject of dataCollection; let isFirstRow=first" [ngClass]="{'RowHeaderCSS' : isFirstRow}">
    <td scope="row">{{dataObject.SNO}}</td>
    <td Overdue-Bucket-Template>{{dataObject.MONTH01}}</td>
    <td Overdue-Bucket-Template>{{dataObject.MONTH02}}</td>
</tr>

https://angular.io/api/common/NgForOf

Local Variables

NgFor provides several exported values that can be aliased to local variables:

1. index The index of the current item in the iterable.
2. first True when the item is the first item in the iterable.
3. last True when the item is the last item in the iterable.
4. even True when the item has an even index in the iterable.
5. odd True when the item has an odd index in the iterable.