Switching language

To manage an event like language change, the Tolgee integration provides the TranslationService.

Initialize the TranslationService in your component as follows:

language.component.ts

import { Component } from '@angular/core';
import { TranslateService } from '@tolgee/ngx';

@Component({
  ...
})
export class AppComponent {
  constructor(public translateService: TranslateService) {}
  ...
}

Next, in template use the changeLanguage method and languageAsync property from TranslateService to handle the language change.

language.component.html

<select
  [value]="translateService.languageAsync | async"
  (change)="translateService.changeLanguage($event.target.value)"
>
  <option value="en">🇬🇧 English</option>
  <option value="cs">🇨🇿 Česky</option>
</select>

Learn more about language change, detection and storage on the Language documentation page.