Ak-Translation

Ak-translation is small translation system, based on json.

setup

npm install ak-translation-lib

in your root module (app.module.ts)

import { AkTranslationModule } from 'ak-translation-lib';

@NgModule({
  ...
  imports: [
    ...,
    AkTranslationModule
  ],
  providers: [
    ...
    AkTranslationService
  ],

in your app component

...
constructor(public akTranslationService: AkTranslationService) {
  this.akTranslationService.addTranslation('de', YourTranslationJsonForDE);
  this.akTranslationService.addTranslation('en', YourTranslationJsonForEN);
  this.akTranslationService.setLanguage('en');
}
..

A typically translation file could be looking like this:

{
  wizard: 'wizard',
  dwarf: 'dwarf',
  hobbit: {
    '=0': 'no Hobbits',
    '=1': 'one Hobbit',
    '=2': 'two Hobbits',
    'other': 'some Hobbits'
  },
  hobbitname: 'hi my name is ${0} ${1}',
  wizardname: 'hi my name is ${firstname} ${lastname}',
  dateTimeFormat: 'YYYY/MM/DD HH:mm:ss A',
  timeFormat: 'HH:mm:ss',
  dateFormat: 'YYYY/MM/DD',
  localeFormat: 'en-US'   
}

Standard usage

dwarf: 'dwarf',
...

<div>{{ ('dwarf' | akTranslation) }}</div>

<ak-translation [akTKey]="'dwarf'"></ak-translation> 

Substitutions

a) string usage

hobbitname: 'hi my name is ${0}',
...

<span>{{ 'hobbitname' | akTranslation : 'Bilbo' }}</span>

<ak-translation [akTKey]="'hobbitname'" [akTSubstitutions]="'Bilbo'"></ak-translation>

b) array usage

hobbitname: 'hi my name is ${0} ${1}',
...

<span>{{ 'hobbitname' | akTranslation : ['Bilbo', 'Beggins'] }}</span>

<ak-translation [akTKey]="'hobbitname'" [akTSubstitutions]="['Bilbo', 'Beggins']"></ak-translation>

c) object usage

wizardname: 'hi my name is ${firstname} ${lastname}',
...

<span>{{ 'wizardname' | akTranslation : (firstname: 'Gandalf', lastname: 'the White'}) }}</span> 

<ak-translation [akTKey]="'wizardname'" [akTSubstitutions]="{firstname: 'Gandalf', lastname: 'the White'}"></ak-translation>

concatenation

// en json
wizardname: 'hi my name is ${firstname} ${lastname}',
gandalfLastname: 'the White', 
// de json
wizardname: 'hallo mein Name ist ${firstname} ${lastname}',
gandalfLastname: 'der Weiße', // in de json

<span>{{ 'wizardname' | akTranslation : ({firstname: 'Gandalf', lastname: 'gandalfLastname' | akTranslation}) }}</span> 
// en: 'hi my name is Gandalf the White'
// de: 'hallo mein Name ist Gandalf der Weiße'
<ak-translation [akTKey]="'wizardname'" [akTSubstitutions]="{firstname: 'Gandalf', lastname: 'lastnameOfGandalf' | akTranslation}"></ak-translation>

Plural

hobbit: {
  '=0': 'no Hobbits',
  '=1': 'one Hobbit',
  '=2': 'two Hobbits',
  'other': 'some Hobbits'
},
...

<span>{{ 'hobbit' | akTranslationPlural }}</span> // no Hobbits
<span>{{ 'hobbit' | akTranslationPlural : 0}}</span> // no Hobbits
<span>{{ 'hobbit' | akTranslationPlural : 1}}</span> // one Hobbit
<span>{{ 'hobbit' | akTranslationPlural : 2}}</span> // two Hobbit
<span>{{ 'hobbit' | akTranslationPlural : 3}}</span> // some Hobbits

<ak-translation-plural [akTKey]="'hobbit'"></ak-translation-plural>
<ak-translation-plural [akTKey]="'hobbit'" [akTPlural]="0"></ak-translation-plural>
<ak-translation-plural [akTKey]="'hobbit'" [akTPlural]="1"></ak-translation-plural>
<ak-translation-plural [akTKey]="'hobbit'" [akTPlural]="2"></ak-translation-plural>
<ak-translation-plural [akTKey]="'hobbit'" [akTPlural]="3"></ak-translation-plural>

Date

dateTimeFormat: 'YYYY/MM/DD HH:mm:ss A',
timeFormat: 'HH:mm:ss',
dateFormat: 'YYYY/MM/DD',
...

<span> {{ '2018-10-06T21:09:31.908Z' | akTranslationDate: 'dateTimeFormat' }}
<ak-translation-date [akTDateValue]="'2018-10-06T21:09:31.908Z'" [akTDateFormat]="'dateTimeFormat'"></ak-translation-date>