[externalPaging]="true" causes rows to disappear?

Hi,

I’m trying to use server pagination but the moment I switch the externalPaging flag to true, I’m unable to get any rows to render. I’ve tried to follow the demo code and apply it to my own situation but still haven’t got anywhere. Here’s my code at the moment:

// in view...
            <ngx-datatable
                class="material"
                [rows]="rows"
                [columns]="columns"
                [columnMode]="'force'"
                [headerHeight]="50"
                [footerHeight]="50"
                [externalPaging]="true"
                [count]="count"
                [offset]="offset"
                [limit]="limit"
                (page)="onPage($event)"    
            >
            </ngx-datatable>

// further down...
    ngOnInit() {    
        this.taskService.testWithPaging(1).subscribe((tasks) => { 
            tasks.map((task, i) => { 
                    this.rows[i++] = { id: task.id, researcher: task.researcher, details: task.details };
            });
      });
    }

I’ve verified and the taskService method returns 100 objects with the properties id, researcher and details. This works without issue when I remove the externalPaging flag (or set it to false) but having it switched on, results in nothing being shown. Is the way in which I’m populating the “rows” variable incorrect?

[szanella]

When paginating externally, the behaviour I’d expect is that the table component should simply output any changes of the current page and be fed with the current page rows that are retrieved externally, usually through an Http request.

From what I’ve seen, this does not happen; what happens instead is that the table component always requires the full data set and moves its offset based on the current page.

As an example, suppose I have 10 items per page, and I move to the third page: what I’d expect to happen is I get an event that signals me I need to get data for the third page (this already works); then I get the 10 items for the third page and feed them as rows to the table. What should happen now is that the table receives them and, knowing we’re using externalPaging, simply displays them; what actually happens is that the table treats them as the full data set and tries to offset them to the third page (as if we weren’t using externalPaging), resulting in an empty output.

This implies that pagination is still handled by the datatable component, and not externally, and makes the externalPaging function somewhat pointless.

Update: @amcdnl I reckon this is related to #138 , which should’ve been fixed by the pull request #714 I’m trying it out

[DanjBethel]

this.count = tasks.length;