pager info and type not working

[Ting]

Hi,

I use kendo ui angular pager in my codes. However, [info] and [type] are not working. Please see attached image. 

I want to show xx of total items, and also each page I want to see numeric numbers.

<kendo-datapager
[pageSize]="pageSize"
[skip]="skip"
[total] = "total"
[type] ="numeric"
[info] ="true"
(pageChange)="onPageChange($event)">
</kendo-datapager>

[Martin]

Hi Ting,

Thank you for the provided screenshot and code snippet.

What makes me an impression is the type property value. By default, it accepts a string value (PagerType). When using square brackets, the numeric value should have quotes, e.g.:

<kendo-datapager
...
[type] ="'numeric'"
...>
</kendo-datapager>

Without brackets the value is accepted as a string:

<kendo-datapager
...
type ="numeric"
...>
</kendo-datapager>

This behavior is Angular specific.

Regarding the info property, it seems to be working as expected on my side:

https://stackblitz.com/edit/angular-ne42vm?file=app/app.component.ts

Let me know if I am missing something.

Regards,
Martin
Progress Telerik

[Ting]

Thank you Martin, the original codes actually worked fine. 

If I zoom out the font size, the total number will show up, if zoom in, it won't. see attached images. 

 

[Martin]

Hello Ting,

Thank you for the screenshots provided.

However, I am not sure what you mean by - 'zoom out and zoom in the font size' . Are you changing the font-size CSS property of the pager numbers:

https://stackblitz.com/edit/angular-ne42vm?file=app%2Fstyles.css

Please provide some more details, ideally, a runnable demo demonstaring the issue (or update the above StackBlitz). This will help us to understand how the pager actually is used and we would be able to provide better support on this case.

Regards,
Martin
Progress Telerik