RTE wont load translation json

[Jan Richter]

Hello,

I loaded translations inside app.component:

import {enableRipple, L10n, loadCldr, setCulture} from '@syncfusion/ej2-base';
import * as EJ2_LOCALE from '@syncfusion/ej2-locale/src/cs.json';
loadCldr(
    require('cldr-data/main/cs/numbers.json'),
    require('cldr-data/main/cs/ca-gregorian.json'),
    require('cldr-data/supplemental/numberingSystems.json'),
    require('cldr-data/main/cs/timeZoneNames.json'),
    require('cldr-data/supplemental/weekData.json'),
    require('cldr-data/main/cs/units.json'),
    require('cldr-data/main/cs/layout.json'),
    require('cldr-data/main/cs/measurementSystemNames.json'),
);
enableRipple(true);
L10n.load({cs: EJ2_LOCALE.cs});
setCulture('cs');

But RTE loaded in default EN language. Same problem on uploader module, grids works fine. Uploader + RTE is inside another component "ticket-datil.component" and inside EJS-TAB module, can this be the problem?

RTE + uploader are loaded in English.

ticket-detail.html:

<ejs-tab id="tab_adaptive" #adaptiveTab heightAdjustMode='Content' height='auto' enablePersistence="true"
         (created)="onCreate()" (selecting)="select($event)">
... ITEM RTE:
​

<ejs-richtexteditor #formComment id='formComment' formControlName="text" locale='cs' [saveInterval]="5000"
                    placeholder='Začněte psát komentář...'
                    [enablePersistence]="false" [fontFamily]='fontFamily'
                    [ngClass]="(commentControl.text.touched && commentControl.text.errors) ? 'is-invalid' : (commentControl.text.touched && commentControl.text.valid) ? 'is-valid' : ''"
                    [toolbarSettings]='tools' [showCharCount]='true' [maxLength]='maxLength' [insertImageSettings]='insertImageSettings'
                    [quickToolbarSettings]='quickToolbarSettings'
                    (actionBegin)='handleFullScreen($event)' (actionComplete)='actionCompleteHandler($event)'>
</ejs-richtexteditor>

... ITEM UPLOIADER:
​

<ejs-uploader #preloadupload id='preloadfileupload' [asyncSettings]='path' [dropArea]='dropElement'
              allowedExtensions='.jpg,.png,.jpeg,.xls,.xlsx,.pdf,.doc,.docx,.rar,.zip,.gif,.csv,.ics,.json,.mp3,.mpeg,.mp4,.odt,.ods,.ppt,.pptx,.txt,.xml'
              maxFileSize=2000000
              [enabled]="!ticket.finished_at && !ticket.deleted_date" (selected)='onFileSelected($event)' (beforeUpload)="beforeFileUpload($event)"
              (uploading)="onFileUpload($event);"
              (removing)="onFileRemove($event);" (success)="onSuccessUpload($event)">
    <e-files>
        <e-uploadedfiles *ngFor="let file of ticket.files" name="{{file.name | fileExtension: false}}" type="{{file.name | fileExtension: true}}"
                         size="{{file.size}}"></e-uploadedfiles>
    </e-files>
</ejs-uploader>

</ejs-tab>​

Attachment: ticketdetail_7a4b4406.zip

[Vinitha Jeyakumar]

Hi Jan, 

 

 

Greetings from Syncfusion support.  

 

 

We have validated your query “Rich Text Editor wont load translation json”.  

  

We have tried to reproduce the issue in the following ways,  

• By ensuring the Rich Text Editor component rendered inside the Tab.
• Also ensured the issue by adding localization support on other languages.
• Ensured the issue by running the sample in all major browsers.

  

But we couldn’t reproduce the issue from our end. We have prepared a sample for your reference,  

Sample: https://stackblitz.com/edit/angular-pjctr8-zmfkna?file=app.component.ts 

 

We suspect that the issue occurred due to the duplicate packages or due to the package cache in your application. Please follow the below steps to resolve this,  

• Go to the ‘node_modules’ folder, find the ‘@syncfusion’ folder and delete it.
• Now delete the ‘package-lock.json’ file from the root directory of the project.
• Now run command ‘npm cache clean –force’.
• The run the command ‘npm install’.
• After the dependencies are installed, run the application.

  

Please ensure the issue after the above steps are done. If the issue still occurs please share the following details?  

• The package version you have used in your application.
• The console error, if anything you have faced in your application.
• If possible please share us the locale file, that you have used in your application.
• If possible please share us with the simple issue reproducible sample or please modify the shared sample with the issue reproducing code.

The above details will be helpful for us to validate and reproduce the issue from our end and assist you at the earliest.  

 

Regards, 

Vinitha