Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Pagination] Example passes string for pageSize, breaking getRangeLabel #8624

Closed
tom10271 opened this issue Nov 24, 2017 · 3 comments · Fixed by #8946
Closed

[Pagination] Example passes string for pageSize, breaking getRangeLabel #8624

tom10271 opened this issue Nov 24, 2017 · 3 comments · Fixed by #8946
Assignees
Labels
P2 The issue is important to a large percentage of users, with a workaround

Comments

@tom10271
Copy link

tom10271 commented Nov 24, 2017

Bug, feature request, or proposal:

Bug

What is the expected behavior?

When I set page size to 1 then go to next page, it should changes from 1 - 1 of 100 to 2 - 2 of 100. Then next page again it should be 3-3 of 100

When I set page size to 2 then go to next page, it should changes from 1 - 2 of 100 to 3 - 4 of 100. Then next page again it should be 5-6 of 100

What is the current behavior?

angular material io pagination of data table bug

When I set page size to 1 then go to next page, it changes from 1 - 1 of 100 to 2 - 20 of 100. Then next page again it should be 3-30 of 100

When I set page size to 2 then go to next page, it changes from 1 - 2 of 100 to 3 - 22 of 100. Then next page again it should be 5-42 of 100

What are the steps to reproduce?

https://material.angular.io/components/paginator/examples

What is the use-case or motivation for changing an existing behavior?

I am just trying to test it for the first time

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 5.0.3
Angular Material 5.0.0-rc.1

Is there anything else we should know?

Plunkr example is not working too(In most of the time for other examples too actually)
angular/material.angular.io#334

@tom10271 tom10271 changed the title https://material.angular.io/components/paginator/examples Pagination in Data table is not working properly when page size set Nov 24, 2017
@tom10271 tom10271 changed the title Pagination in Data table is not working properly when page size set Pagination in Data table is not displaying result range properly when page size set Nov 24, 2017
@tom10271 tom10271 changed the title Pagination in Data table is not displaying result range properly when page size set Pagination in Data table is not displaying result range ending number properly Nov 24, 2017
@andrewseguin
Copy link
Contributor

The example takes the form field's value for the page size and passes it to the MatPaginator. However, it's being passed as a string, which is fine for all the operations the paginator does (e.g. multiply page size by page index) but getRangeLabel does startIndex + pageSize which coerces to a string rather than uses the size as a number.

Will need to fix this by using coerceNumberProperty

@andrewseguin andrewseguin changed the title Pagination in Data table is not displaying result range ending number properly [Pagination] Example passes string for pageSize, breaking getRangeLabel Nov 27, 2017
@andrewseguin andrewseguin self-assigned this Nov 27, 2017
@andrewseguin andrewseguin added the P2 The issue is important to a large percentage of users, with a workaround label Nov 27, 2017
@mhosman
Copy link

mhosman commented Dec 28, 2017

This fix is available in last build? I have the same error with the last version (5.0.2).

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 8, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
P2 The issue is important to a large percentage of users, with a workaround
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants