CODEWITHSUNDEEP
angularng-classangular-datatables
Asridh Kumar
Asridh Kumar

Reputation: 525

ngClass is not being applied inside angular data table?

Below code not applying ngClass.

 <table mat-table [dataSource]="dataSourceAB">
  <ng-container matColumnDef="Type">
   <th mat-header-cell *matHeaderCellDef> Type </th>
   <td mat-cell *matCellDef="let element" [ngClass]="(element.TxnType=='Credit')?'text-success':'text-danger'"> {{element.TxnType}} </td>
  </ng-container>
  <tr mat-header-row *matHeaderRowDef="displayedColumnsAB"></tr>
  <tr mat-row *matRowDef="let row; columns: displayedColumnsAB;"></tr>
/table>

I am getting the proper data to dispaly but class is not applied. Wts wrong ??

Upvotes: 1

Views: 2956

Answers (1)

Krishna Rathore
Krishna Rathore

Reputation: 9687

add text-success and text-danger in css

Stackblitz demo

Component.html

<table mat-table [dataSource]="dataSourceAB" class="mat-elevation-z8">
    <ng-container matColumnDef="name">
        <th mat-header-cell *matHeaderCellDef> Type </th>
        <td mat-cell *matCellDef="let element" [ngClass]="(element.TxnType=='Credit')?'text-success':'text-danger'"> {{element.TxnType}}
            </td>
    </ng-container>
    <tr mat-header-row *matHeaderRowDef="displayedColumnsAB"></tr>
    <tr mat-row *matRowDef="let row; columns: displayedColumnsAB;"></tr>
</table>

Upvotes: 3

Related Questions