This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
npm install i18next-xhr-backend i18next-browser-languagedetector --save |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export function appInit(i18next: ITranslationService) { | |
return () => | |
i18next | |
.use(i18nextXHRBackend) | |
.use(i18nextLanguageDetector) | |
.init({ | |
whitelist: ['en', 'el'], | |
fallbackLng: 'en', | |
debug: true, | |
returnEmptyString: false, |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
➜ mkdir -p src/assets/locales/ | |
➜ cd src/assets/locales | |
➜ touch en.translations.json | |
➜ touch el.translations.json | |
// el.translations.json | |
{ | |
"message": "Καλως ήλθατε στο PhraseApp i18next" | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
➜ mkdir header | |
➜ touch header/header.component.html | |
➜ touch header/header.component.ts |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<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> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 { |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { HeaderComponent } from './header/header.component'; | |
... | |
@NgModule({ | |
declarations: [ | |
AppComponent, | |
HeaderComponent . <--- Added | |
], |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
... | |
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 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
➜ ./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 |