Przejdź do głównej zawartości

Internationalization (i18n)

Multi-language support using ngx-translate.

Supported Languages

CodeLanguageStatus
enEnglish✅ Default
esSpanish
frFrench
ruRussian
bgBulgarian
heHebrew
arArabic✅ (RTL)
ptPortuguese
deGerman
nlDutch
zhChinese

Translation Files

Located at apps/gauzy/src/assets/i18n/:

i18n/
├── en.json # English (source)
├── es.json # Spanish
├── fr.json # French
├── ru.json # Russian
└── ...

Usage

In Templates

<!-- Pipe -->
<h1>{{ 'DASHBOARD.TITLE' | translate }}</h1>

<!-- Directive -->
<p [translate]="'DASHBOARD.SUBTITLE'" [translateParams]="{ count: 5 }"></p>

In Components

constructor(private translateService: TranslateService) {}

ngOnInit() {
const title = this.translateService.instant('DASHBOARD.TITLE');
}

Translation File Format

{
"DASHBOARD": {
"TITLE": "Dashboard",
"SUBTITLE": "Welcome back, {{ name }}",
"WIDGETS": {
"TOTAL_HOURS": "Total Hours",
"PROJECTS": "Projects"
}
}
}

RTL Support

Arabic and Hebrew enable RTL layout:

this.translateService.onLangChange.subscribe(({ lang }) => {
document.dir = ["ar", "he"].includes(lang) ? "rtl" : "ltr";
});

Configuration

# Default language
AVAILABLE_LOCALES=en,es,fr,ru,bg
DEFAULT_LOCALE=en