List all pages with server-side pagination

[Danyx1980]

Seems like the component only handles a few previous and coming pages, but can't show the total amount of item pages (so I can't have a "last" button). From some previous posts and questions I've noticed ServerDataSource being mentioned, but I can't find any documentation on the topic.

Is there a way to achieve something similar to this [1, ..., 6, 7, 8, 9, 10, ..., 27] where I get the total amount of items from the server and the table calculates how many pages that would be?

[lalosh]

Facing the same issue, how come they have an example of server-side pagination in the documentation!
https://akveo.github.io/ng2-smart-table/#/examples/populate-from-server

[lalosh]

I found that the response header should have X-Total-Count with the value of the total items and it all works out right 😄
https://stackoverflow.com/questions/42974715/pagination-issue-with-ng2-smart-table

while I cannot change backend response header I made an interceptor that change the response header to add the X-Total-Count header and it works out greate

import { Injectable } from '@angular/core';
import { HttpHandler, HttpRequest, HttpEvent, HttpHeaders, HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';

@Injectable({
  providedIn: 'root'
})
export class PagingInterceptorService {

  constructor() { }

  intercept(req: HttpRequest<any>, next: HttpHandler):
    Observable<HttpEvent<any>> {

    return next.handle(req)
      .pipe(
        map((event: any) => {
          if (event instanceof HttpResponse) {


            if (event.body.pagingInfo && event.body.pagingInfo.totalItems) {

              let newHeaders = new HttpHeaders({
                'X-Total-Count': String(event.body.pagingInfo.totalItems)
              });

              let newEvent = event.clone({ headers: newHeaders });
          
              return newEvent;

            }

            return event;
          }

          return event;
        })
      );
  }

}