Ag-Grid has to load the Grid data on click of a button

Question

The below link is having similar solution but it is with setRowData and I am trying to implement Infinite Row Model with setDatasource

Ag-grid in Angular does not refresh when RowData is changed

This is where I am populating the Grid with onGridReady event

onGridReady(params: any) {

this.gridApi = params.api;
this.gridColumnApi = params.columnApi;

this.userService.GetUserDetails(this.loginUserId)
  .subscribe((data) => {
    var dataSource = {
      rowCount: null,
      getRows: function (params) {
        setTimeout(function () {
          var rowsThisPage = data.slice(params.startRow, params.endRow);
          var lastRow = -1;
          if (data.length <= params.endRow) {
            lastRow = data.length;
          }
          params.successCallback(rowsThisPage, lastRow);
        }, 500);
      },
    };
    params.api.setDatasource(dataSource);
  });
}

How can I refresh the Grid with setDatasource in the click event of a button?

I get the below error if I replace with setDatasource

ag-Grid: datasource is missing getRows method

Any help would be greatly appreciated.