DEV Community

loading...

Discussion on: Angular Material Pagination Datasource

Collapse
n_mehlhorn profile image
Nils Mehlhorn Author

Hey John, sorry for the late reply. The example on StackBlitz is implementing a user service, however, that one is faking server-requests: stackblitz.com/edit/angular-pagina...

You'd need to implement the same signature but make HTTP-requests to your paginated server endpoint


export class UserService {
  constructor(private http: HttpClient) {}

  page(request: PageRequest<User>, query: UserQuery): Observable<Page<User>> {
    // parse HTTP-GET parameters that your server understands, e.g:
    const params = {
      pageNumber: request.page, 
      pageSize: request.size,
      sorting: `${request.sort.property},${request.sort.order}`,
      text: query.search,
      registrationDate: query.registration
    }
    // make request
    return this.http.get("/users", {params}).pipe(
      map(/* map to Page<User>> if the type is different */)
    )
  }
}

Hope this helps, otherwise please ask further, I'll reply timely now

Collapse
jparlato profile image
John P. Parlato

That is just what I needed. I want to thank you for your article and your response. Take care.

Thread Thread
n_mehlhorn profile image
Nils Mehlhorn Author

Most welcome! You might want to join my mailing list so I can notify you when I publish something new :)