Display row only if certain conditions are met in ngx-datatable

By Aryan Maurya / March 17, 2022

TypeScript File

In ngx-datatable we show our data to the datatable link this [rows]=”rows”, what you need to do is filter out the objects you don’t want to be in the datatable, something like this in your TypeScript file

filterDataList: any;

const case1= 'Aryan';
const case2= 'Maurya';
this.filterDataList = this.rows.filter(row => case1.includes(row.first_name));
this.filterDataList = this.rows.filter(row => !case2.includes(row.last_name));

HTML File

<ngx-datatable
  [rows]="filterRewardDataList"
>
  <ngx-datatable-column
    name="Sr. No"
    headerClass="no-sorting text-center"
    prop="srNum"
    [sortable]="false"
  >
    <ng-template let-value="value" ngx-datatable-cell-template>
      <div class="text-center">{{ value }}</div>
    </ng-template>
  </ngx-datatable-column>
  <ngx-datatable-column
    name="First Name"
    prop="first_name"
  >
    <ng-template let-value="value" ngx-datatable-cell-template>
      <div class="text-center text-wrap">
        {{ value }}
      </div>
    </ng-template>
  </ngx-datatable-column>
  <ngx-datatable-column
    name="Last Name"
    prop="last_name"
  >
    <ng-template let-value="value" ngx-datatable-cell-template>
      <div class="text-center text-wrap">
        {{ value }}
      </div>
    </ng-template>
  </ngx-datatable-column>
</ngx-datatable>

Result

ngx datatable

 

May I Help You?