PdfViewer globalization

[Piotr Golabek]

Hi 

Could you tell me, how to load locale strings for PdfViewer component?

I'm embedding PdfViewerComponent in one of the components rendered via routing from main app.component. I'm instantiating PdfViewer via HTML tag in component template:

<ejs-pdfviewer #pdfViewer id="pdfViewer" locale="pl" [serviceUrl]='service' [documentPath]='document' 
class="e-control e-pdfviewer e-lib">ejs-pdfviewer>

As for the locale strings, they are loaded for all the components in app.components, like this:

L10n.load({
  'pl': {
    'grid': {
      "Add": " Dodaj nowy rekord",                // You can change the Locale words here
      "Edit": "Edytuj rekord",
      "Cancel": "Anuluj operację",
      "Update": "Uaktualnij rekord",
      "Delete": "Usuń rekord",
    },
    'PdfViewer': {
      'PdfViewer': 'Podgląd PDF',
      'Cancel': 'Anuluj',
      'Download file': 'Pobierz plik',
... and so on.
This works for all the other components, like DateRangePicker or RTFEditor, but not for PdfViewer.
If debug a little bit, I can see, that L10n.local static variable gets loaded with this content from app.component, but when it comes to 
pdfviewer.preRender method, which apparently creates an instance of L10n and tries to get locale strings from it, 
the L10n.locale at this level is empty... I don't know nor understand nitties and gritties of classes and object in Typescript, 
but it looks like static L10n 'class object' at app.component level is different from  the one at PdfViewer level. 
In your documentation you write, that L10n should be loaded with: (link)
<script>
    ej.base.L10n.load({
                'ar-AE': {
                    'PdfViewer': {
                        'PdfViewer': 'قوات الدفاع الشعبي المشاهد',
I really don't know, how to do that ... Tried to put it in the code  of component employing pdfViewer, like this: 


import {ej} from "@syncfusion/ej2-base/dist/global";

ej.base.L10n.load({
    'pl': {
        'PdfViewer': {
            'PdfViewer': 'Podgląd PDF',
            'Cancel': 'Anuluj',
and have used an import suggested by my IDE, as above, but that does not satisfy the compiler (although  there is 
ej namespace  and base constant declaration there..)
It all ends with:
Module not found: Error: Can't resolve '@syncfusion/ej2-base/dist/global' in '...'i ｢wdm｣: Failed to compile. 

I have tried many strange and desperate things to get it working, but to no success...

Could you please advise me, how should it be done?

(sorry for wild formatting ...)
Best regards,  

Piotr Golabek     



 

[Akshaya Arivoli]

Hi Piotr,  

Thank you for contacting Syncfusion support.  

 We can localize the text content using locale API  available in PDF Viewer. We have created sample for the same and shared in the below link,  

  https://stackblitz.com/edit/angular-3keqje-hlz38s?file=app.component.ts   

Code Snippet  

App.component.html  

  

<div class="control-section">  

    <div class="content-wrapper">  

        <ejs-pdfviewer id="pdfViewer" [serviceUrl]='service'  [documentPath]='document'  locale='ar-AE' style="height:640px;display:block"></ejs-pdfviewer>  

    </div>  

</div>  

  

  

  

app.component.ts  

  

  

import {L10n, setCulture} from '@syncfusion/ej2-base';  

  

  

 L10n.load({  

                'ar-AE': {  

                    'PdfViewer': {  

                        'PdfViewer': 'قوات الدفاع الشعبي المشاهد',  

                        'Cancel': 'إلغاء',  

                        'Download file': 'تحميل الملف',  

                        'Download': 'تحميل',  

                        'Enter Password': 'هذا المستند محمي بكلمة مرور. يرجى إدخال كلمة مرور.',  

                        'File Corrupted': 'ملف تالف',  

                        'File Corrupted Content': 'الملف تالف ولا يمكن فتحه.',  

                        'Fit Page': 'لائق بدنيا الصفحة',  

                        'Fit Width': 'لائق بدنيا عرض',  

                        'Automatic': 'تلقائي',  

                        'Go To First Page': 'عرض الصفحة الأولى',  

                        'Invalid Password': 'كلمة سر خاطئة. حاول مرة اخرى.',  

                        'Next Page': 'عرض الصفحة التالية',  

                        'OK': 'حسنا',  

                        'Open': 'فتح الملف',  

                        'Page Number': 'رقم الصفحة الحالية',  

                        'Previous Page': 'عرض الصفحة السابقة',  

                        'Go To Last Page': 'عرض الصفحة الأخيرة',  

                        'Zoom': 'تكبير',  

                        'Zoom In': 'تكبير في',  

                        'Zoom Out': 'تكبير خارج',  

                        'Page Thumbnails': 'مصغرات الصفحة',  

                        'Bookmarks': 'ال  

  

……………………………  

……………..  

…………….  

…………….  

  

  

          'Annotation Edit text': 'تحرير التعليق التوضيحي'  

                    }  

                }  

            });  

  

  

Please try it and if you still have concerns revert us with more details about your issue and the modified sample, if you have concerns.   

Regards,   

Akshaya