API of Tolgee for Angular

NgxTolgeeModule

The Tolgee Module. Use it to configure Tolgee for module.

Example usage:

@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...
    NgxTolgeeModule.forRoot({
      staticData: {
        en: () => import('../i18n/en.json'),
        cs: () => import('../i18n/cs.json'),
      },
      preloadFallback: true,
      apiUrl: environment.tolgeeApiUrl,
      apiKey: environment.tolgeeApiKey,
      ui: UI,
    })
  ],
})

Method forRoot

Returns ModuleWithProviders<NgxTolgeeModule>. Enables passing configuration to the module.

• parameter options - Tolgee configuration properties described in configuration section.

TranslateService

Contains methods to translate text used by other components.

method get

Returns Observable providing current translation value depending on current language. When language or translation is changed, new value is emitted. This method is wrapping the string in development mode.

this.subscription = this.translateService
      .get('this_is_a_key_with_params', { key: 'value' }, 'Default value')
      .subscribe((val) => (this.translated = val));

• returns observable emitting the translated value - Observable<string>
• parameter key - The key to translate.
• parameter params - Parameters to interpolate.
• parameter defaultValue - Value to render, when no translation is provided.

method getSafe

Returns Observable providing current translation value depending on current language. When language or translation is changed, new value is emitted. This method doesn't wrap the key, so in-context localization won't be supported.

this.subscription = this.translateService
  .getSafe('this_is_a_key_with_params', { key: 'value' }, 'Default value')
  .subscribe((val) => (this.translated = val));

• returns observable emitting the translated value - Observable<string>
• parameter key - The key to translate. string
• parameter params - Parameters to interpolate. Record<string, any>
• parameter defaultValue - Value to render, when no translation is provided. string

method instant

Returns the translated value synchronously. When language or translation is changed it emits new value. This method is wrapping the key in development mode.

const translated = this.translateService
  .instant('this_is_a_key_with_params', { key: 'value' }, 'Default value')

• returns - the translated value string
• parameter key - The key to translate. string
• parameter params - Parameters to interpolate. Record<string, any>
• parameter defaultValue - Value to render, when no translation is provided. string

method instantSafe

Returns the translated value synchronously. When language or translation is changed it emits new value. This method doesn't wrap the key, so in-context localization won't be supported.

const translated = this.translateService
  .instantSafe('this_is_a_key_with_params', { key: 'value' }, 'Default value')

• returns - the translated value string
• parameter key - The key to translate. string
• parameter params - Parameters to interpolate. Record<string, any>
• parameter defaultValue - Value to render, when no translation is provided. string

method getCurrentLang

Returns current language

this.translateService.getCurrentLang() // "en"

returns string

method setLang

Sets current language

this.translateService.setLang('en')

parameter language

The language to be set.

method start

Runs the Tolgee.run method from @tolgee/core library.

onLangChange

EventEmitter<never> emitting every time language is changed.

onTranslationChange

EventEmmitter<TranslationData> emitting when translation is changed.

type TranslationData

{
    key: string; // the key which was changed
    translations: { // new translations for languages
        [key: string]: string;
    };
}

e.g.

{
    key: "i_am_a_key"
    translations: {
      "en": "English translation",
      "de": "German translation"
    };
}

TComponent

Component with t attribute selector. Replaces the content of the element with the translated value.

• Input key - Key to translate
• Input params - Object of parameters to interpolate
• Input default - Default value

<div t key="this_is_a_key_with_params" [params]="{key: 'value', key2: 'value2'}"></div>

translate pipe

Translates a key with specific parameters or default value. The pipe is wrapping strings in development mode to enable in-context editing.

Syntax:

key to translate | translate[:default value]
// or
key to translate | translate[:parameters]
// or
key to translate | translate[:defafault value][:parameters]

Example usages:

{{ 'this_key_does_not_exist' | translate:'This is default'}}
{{ 'this_is_a_key_with_params' | translate:{key: 'value', key2: 'value2'} }}
{{ 'this_is_a_key_with_params' | translate:"Default value":{key: 'value', key2: 'value2'} }}

• Default value of type string
• Parameters are Record<string, any>

stranslate pipe

Translates a key with specific parameters or default value. It provides the same API as the translate pipe, but it doesn't wrap the key in development mode, so in-context editing is not available.

Syntax:

key to stranslate | stranslate[:default value]
// or
key to stranslate | stranslate[:parameters]
// or
key to stranslate | stranslate[:defafault value][:parameters]

Example usages:

{{ 'this_key_does_not_exist' | stranslate:'This is default'}}
{{ 'this_is_a_key_with_params' | stranslate:{key: 'value', key2: 'value2'} }}
{{ 'this_is_a_key_with_params' | stranslate:"Default value":{key: 'value', key2: 'value2'} }}

• Default value of type string
• Parameters are Record<string, any>