<div class="container tableDiv">
    <ngx-datatable class="material striped" [rows]="list" [columnMode]="'force'" [headerHeight]="50" [rowHeight]="'auto'" 
     [messages]="{emptyMessage: 'No Records Available'}">
      <ngx-datatable-column [sortable]="true" [resizeable]="false" prop='candidateName' name='Candidate'>
        <ng-template let-row="row" ngx-datatable-cell-template>
          {{row.candidateName | titlecase}} <br>
          <h2 class="td-email">{{row.candidateEmail}}</h2>
        </ng-template>
      </ngx-datatable-column>
      <ngx-datatable-column [sortable]="true" [resizeable]="false" prop='jobTitle' name='Job ID'>
        <ng-template let-row="row" ngx-datatable-cell-template>
          {{row.jobTitle}}
        </ng-template>
      </ngx-datatable-column>
      <ngx-datatable-column [sortable]="true" [resizeable]="false" prop='location' name='Location'>
        <ng-template let-row="row" ngx-datatable-cell-template>
          {{row.location}}
        </ng-template>
      </ngx-datatable-column>
      <ngx-datatable-column [sortable]="true" [resizeable]="false" prop='checkedInDate' name='Checked-In on'>
        <ng-template let-row="row" ngx-datatable-cell-template>
          {{row.checkedInDate}}
        </ng-template>
      </ngx-datatable-column>
      <ngx-datatable-column [sortable]="true" [resizeable]="false" prop='feedback' name='Checked-In at'>
        <ng-template let-row="row" ngx-datatable-cell-template>
          {{row.checkedInTime}}
        </ng-template>
      </ngx-datatable-column>
    </ngx-datatable>
  </div>