Skip to content

Instantly share code, notes, and snippets.

View theodesp's full-sized avatar
🦄
Jumping over Rainbows...

Theofanis Despoudis theodesp

🦄
Jumping over Rainbows...
View GitHub Profile
npm install i18next-xhr-backend i18next-browser-languagedetector --save
export function appInit(i18next: ITranslationService) {
return () =>
i18next
.use(i18nextXHRBackend)
.use(i18nextLanguageDetector)
.init({
whitelist: ['en', 'el'],
fallbackLng: 'en',
debug: true,
returnEmptyString: false,
➜ mkdir -p src/assets/locales/
➜ cd src/assets/locales
➜ touch en.translations.json
➜ touch el.translations.json
// el.translations.json
{
"message": "Καλως ήλθατε στο PhraseApp i18next"
}
➜ mkdir header
➜ touch header/header.component.html
➜ touch header/header.component.ts
<div>
<select formControlName="languages" (change)="changeLanguage($event.target.value)">
<option *ngFor="let lang of languages" [value]="lang" [selected]="language === lang">
<a *ngIf="language !== lang" href="javascript:void(0)" class="link lang-item {{lang}}">{{ '_languages.' + lang | i18nextCap }}</a>
<span *ngIf="language === lang" class="current lang-item {{lang}}">{{ '_languages.' + lang | i18nextCap }}</span>
</option>
</select>
</div>
import { ITranslationService, I18NEXT_SERVICE } from 'angular-i18next';
import { Component, ViewEncapsulation, Inject, OnInit } from '@angular/core';
@Component({
selector: 'header-language',
encapsulation: ViewEncapsulation.None,
templateUrl: './header.component.html',
})
export class HeaderComponent implements OnInit {
import { HeaderComponent } from './header/header.component';
...
@NgModule({
declarations: [
AppComponent,
HeaderComponent . <--- Added
],
...
38: i18next - i18next, file extension: json
39: episerver - Episerver XML, file extension: xml
...
Select the format to use for language files you download from PhraseApp (1-39): 38
Enter the path to the language file you want to upload to PhraseApp.
For documentation, see https://help.phraseapp.com/phraseapp-for-developers/phraseapp-client/configuration#push
Source file path: [default ./locales/<locale_name>/translations.json] ./src/assets/locales/<locale_name>.translation.json
Enter the path to which to download language files from PhraseApp.
For documentation, see https://help.phraseapp.com/phraseapp-for-developers/phraseapp-client/configuration#pull
Target file path: [default ./locales/<locale_name>/translations.json] ./src/assets/locales/<locale_name>.translation.json
We created the following configuration file for you: .phraseapp.yml
➜ ./phraseapp pull
Downloaded en to src/assets/locales/en.translation.json
Downloaded de to src/assets/locales/de.translation.json
Downloaded el to src/assets/locales/el.translation.json