primeng turbotable with font awesome icons in the cell

Question

When I use font-awesome icons in a turbo table, the size of the cell is off.

I am doing something like this: {{tenant.name}}

I am using primeng 5.2 and font-awesome 4.2.

Has anyone successfully added an icon to a turbo table?

If so, which icons did you use and how did you do it?

Thanks

Answer 1

Have you succeeded in displaying a font awesome icon outside your TurboTable ? If yes, it should work inside the table.

I created this Plunker where you can see Font Awesome icons inside a TurboTable.

You can then compare with your code to see what's wrong for you.

<p-table [value]="cars">
    <ng-template pTemplate="header">
        <tr>
            <th>Vin</th>
            <th>Year</th>
            <th>Brand</th>
            <th>Color</th>
            <th>Actions</th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-car>
        <tr>
            <td>{{car.vin}}</td>
            <td>{{car.year}}</td>
            <td>{{car.brand}}</td>
            <td>{{car.color}}</td>
            <td><i class="fa fa-edit"></i><i class="fa fa-close"></i></td>
        </tr>
    </ng-template>
</p-table>