Access Filtered Record Count in Kendo Grid for Angular When Using kendoDataBinding

Question

I have a kendo grid defined in a component something like this:

<p> Showing (filtered record count) of (total record count) </p>
<kendo-grid
  [kendoGridBinding]="data"
  [pageSize]="20"
  [paeable]="pagerSettings"
  filterable="menu">

</kendo-grid>

(Pager settings defines page sizes in an array similar to this: [5,10,25,100])

As shown, I have a requirement to show (and update) the filtered record count. The kendo <pager-info> does not meet the customer's request, as the display is outside of the table.

How do I access the count of filtered records and total records when using the [kendoGridBinding] to show local data like this?

Answer 1

How do I access the count of filtered records and total records when using the [kendoGridBinding] to show local data like this?

Total count - is the length of the data. You can initialise it in constructor. Filtered count - is the length of array returned by filterBy

I've created a working example here https://codesandbox.io/s/blissful-morse-s24jk9?file=/src/app/app.component.ts:477-489

Answer 2

I have a similar issue in that I need to get the currently filtered data to perform some action on all the rows, not the entire set of data and not just what's displayed, either of which are "readily" available. What I found after poking around is that if you either keep track of the current filter (through, say, the (filterChange) event) or have access to the the grid component itself and its filter property, you can do something like the following:

import { process } from '@progress/kendo-data-query';
...
const filteredRecordCount = process(this.data, { filter: this.currentFilter}).total;