6

I want show the row count in my AgGrid, but I got a problem.

    ngOnInit() { 
      console.log(this.gridOptions.api.getDisplayedRowCount());
    }

Error:

ERROR TypeError: Cannot read property 'getDisplayedRowCount' of undefined
    at ProjectListComponent.webpackJsonp../src/app/project-list/project-list.component.ts.ProjectListComponent.ngOnInit (project-list.component.ts:178)
    at checkAndUpdateDirectiveInline (core.js:12411)
    at checkAndUpdateNodeInline (core.js:13935)
    at checkAndUpdateNode (core.js:13878)
    at debugCheckAndUpdateNode (core.js:14771)
    at debugCheckDirectivesFn (core.js:14712)
    at Object.eval [as updateDirectives] (ProjectListComponent_Host.ngfactory.js? [sm]:1)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:14697)
    at checkAndUpdateView (core.js:13844)
    at callViewAction (core.js:14195)

Api the AgGrid:

getDisplayedRowCount()  Returns the total number of displayed rows.

I don't understand why I have this problem...

2 Answers 2

14

(You mention ngOnInit so I assume you are using Angular)
The problem is that the api is not available in ngOnInit. You should listen for the gridReady event if you need the grid api.

gridReady: ag-Grid has initialised. Use this event if, for example, you need to use the grid's API to fix the columns to size. Documentation

html:

<ag-grid-angular   style="width: 100%; height: 372px;"
  (gridReady)="onGridReady()">
</ag-grid-angular>

component ts:

onGridReady(params: any) {
  console.log('grid ready');
  console.log(this.gridOptions.api.getDisplayedRowCount());
}

You should also keep in mind that there is a note on this site:

Sometimes the gridReady grid event can fire before the Angular component is ready to receive it, so in an Angular environment its safer to rely on AfterViewInit instead before using the API.

Despite that I never had any problems using the gridReady event.

0

If you use ag-grid react component then use the below procedure to get the count

<AgGridReact
    columnDefs={columnDefs}
    rowData={rowData}
    defaultColDef={defaultColDef}
    onGridReady={onGridReady}
></AgGridReact>


const onGridReady = (params) => {
        setRow(params.api.getDisplayedRowCount());
    };

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.