Search results

Localization

You can localize the Report Viewer static text and tooltip. To render the static text with specific culture, refer to the following corresponding culture script files and set culture name to the locale property of the Report Viewer.

* `ej.localetexts.fr-FR.min.js`
* `ej.culture.fr-FR.min.js`
  • Refer to the ej.localetexts.fr-FR.min.js and ej.culture.fr-FR.min.js script files from node_modules in the app.module.ts file .
import { NgModule, enableProdMode, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule } from '@angular/router';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { ReportsAngularModule } from '@syncfusion/reporting-angular';
import '../../node_modules/syncfusion-ej-global/l10n/ej.localetexts.fr-FR.min.js';
import '../../node_modules/syncfusion-ej-global/i18n/ej.culture.fr-FR.min.js';
import { AppComponent } from './app.component';
import { TextboxComponent } from './textbox/textbox.component';
...
...

N> If you import the culture before the ReportsAngularModule, you will get the following error in the application. So, you should import the culture after the @syncfusion/reporting-angular package.

Angular culture error

Initialize the locale property in the component.ts and component.html pages.

<ej-reportviewer id="reportViewer_Control"
    [reportServiceUrl] = "serviceUrl"
    [processingMode] = "Remote"
    [reportServerUrl] = "serverUrl"
    [reportPath] = "reportPath"
    [locale]='locale'>
</ej-reportviewer>
import { Component, ViewChild } from '@angular/core';
import { ReportsAngularModule } from '@syncfusion/reporting-angular/src/ej/core';

@Component({
    selector: 'ej-app',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    public serviceUrl: string;
    public reportPath: string;
    public serverUrl: string;
    public locale: string;

    constructor() {
        this.serviceUrl = 'https://reports.syncfusion.com/demos/services/api/ReportApi';
        this.reportPath = 'Sales Order Detail.rdl';
        this.locale = "fr-FR";
    }
}