Primeng: p-calendar - Localization support for number scripts

[m-vignesh]

Improvement Request :

Some languages have their own number scripts (Eg: Hindi, Chinese, etc Click Here ). So, instead of having only the Arabic Numbers in the p-calendar, it would be really useful, if support for specifying the number scripts were provided similar to the Day names, month names, etc.

Current behavior
p-calendar Doesn't support number scripts in localization

Expected behavior
p-calendar Need to support number scripts in localization

What is the motivation / use case for changing the behavior?
Some languages have their own number scripts. So, it needs to be supported.

• Angular version: 8.X
  

• PrimeNG version: 8.X
  

• Browser: [all]
  

• Language: [all]

• Node (for AoT issues): node --version = 10.X

[JacobSiegle]

I think you can use the date template to get this to work, the docs shows an example of it being used -

    <div class="ui-g-12 ui-md-4">
        <h3>Date Template</h3>
        <p-calendar [(ngModel)]="date11">
            <ng-template pTemplate="date" let-date>
                <span [ngStyle]="{backgroundColor: (date.day < 21 && date.day > 10) ? '#81C784' : 'inherit'}" style="border-radius:50%;padding: .25em;width: 1.75em; height:1.75em; display:block;">{{date.day}}</span>
            </ng-template>
        </p-calendar>
    </div>

It probably would be nice to pass in numbers 1-31. Needs maintainers opinion.

[m-vignesh]

I think you can use the date template to get this to work, the docs shows an example of it being used -

    <div class="ui-g-12 ui-md-4">
        <h3>Date Template</h3>
        <p-calendar [(ngModel)]="date11">
            <ng-template pTemplate="date" let-date>
                <span [ngStyle]="{backgroundColor: (date.day < 21 && date.day > 10) ? '#81C784' : 'inherit'}" style="border-radius:50%;padding: .25em;width: 1.75em; height:1.75em; display:block;">{{date.day}}</span>
            </ng-template>
        </p-calendar>
    </div>

It probably would be nice to pass in numbers 1-31. Needs maintainers opinion.

Hi @JacobSiegle ,
Seems fine for date part. But how do we do it for time and year?
Can you please show me where this has been mentioned in the Docs?
Thanks..!

[JacobSiegle]

You go to https://www.primefaces.org/primeng/#/calendar, hit source, and then find the calendar that's called "Date Template".

Taking a quick look at the source you unfortunately cannot change the year or time display.

[m-vignesh]

You go to https://www.primefaces.org/primeng/#/calendar, hit source, and then find the calendar that's called "Date Template".

Taking a quick look at the source you unfortunately cannot change the year or time display.

Ya. I got it. Thanks.

[mertsincan]

Thanks @JacobSiegle ;)

[JacobSiegle]

@mertsincan I dont think this one is completed. The date can be worked around as I mentioned previously, but there's no way to get a custom year or time to display like @m-vignesh mentioned. I'm not sure what the best way to do this would be since i'm not too familiar with composing numbers/times in other languages. The obviously basic approach is to just force the user to provide all the number/times compositions themselves as @m-vignesh suggests.

[m-vignesh]

Yes @JacobSiegle . It would be nice if I am able to provide number scripts from 0-9 (similar to day and month) and the picker can localise using it.

[JacobSiegle]

@m-vignesh I don't think providing 0-9 only works unless some other parameter is passed in that causes the numbers to know how to work. For example I asked someone who knows a bit of japanese and the number 10 has it's own symbol which is 十. To make the number 20 you take the number 2 and the number 10 which is 二十 so composing the number really depends on the language. Maybe the user just has to pass in all the numbers they want to use? Possibly a maintainer knows more or has looking into how other libraries handle this.

[m-vignesh]

@m-vignesh I don't think providing 0-9 only works unless some other parameter is passed in that causes the numbers to know how to work. For example I asked someone who knows a bit of japanese and the number 10 has it's own symbol which is 十. To make the number 20 you take the number 2 and the number 10 which is 二十 so composing the number really depends on the language. Maybe the user just has to pass in all the numbers they want to use? Possibly a maintainer knows more or has looking into how other libraries handle this.

Yes. I agree. Then we need to pass all the numbers that we need to use.