My server code takes a long time to determine exactly how many items are returned so instead of processing the count fully, if after a few seconds it does not finish then it cancels. I then return a count of -1 for the count.

I used all the examples to create an “international” paginator so that I could change the label. I implemented MatPaginatorIntl according this example and changed the getRangeLabel so that if the length was -1 it would show “Page 1 of many” as below:

getRangeLabel(page: number, pageSize: number, length: number): string {
    if (length === 0) {
      return "Page 1 of 1";
    }
    else if(length === -1) {
      return `Page ${page + 1} of many`;
    }

    const amountPages = Math.ceil(length / pageSize);
    return `Page ${page + 1} of ${amountPages}`;
  }

The problem is that because I am setting the length to -1, the next buttons are disabled.

Do you have any suggestions of a better way of accomplishing this?

UPDATE:

I have a awful workaround which is, rather than setting the total to -1, I have set it to 999999999. This large number can easily be described as “many” and it is unlikely that the value, if successfully counted will be exactly that. I am also checking on the server side to see if the number returned is the same as the number requested per page. If it is less then we know we have reached the end and I can calculate the total by adding the offset to the number returned.

However, I don’t like this workaround so if anybody else has a suggestion of a way of doing this I would gladly hear it.