Разработка компонента "i18s (Смена языка)"

Этот компонент разрабатывался для того чтобы была возможность менять языки у компонентов.

В разработке этого компонента используется клиент HTTP Angular для запроса и получения данных о тексте, так же клиент ngx-translate для реализации смены языка.

<ion-label>{{ "HTML element name | translation function name"(translate) }}</ion-label>

В папке i18s следует добавить строки перевода для разных языков. Например, в ru.json вы можете иметь:

{
"Inbox": "Входящие",
"tab1": {
"tabName": "Первая закладка",
"invite": "Сейчас вы выбрали {{lang}}"
}
}

А в en.json вы можете иметь:

"Inbox": "Входящие",
"tab1": {
"tabName": "Tab One goes here",
"invite": "Теперь вы выбрали {{lang}}"
}

Для перевода на английский язык вы можете использовать следующую функцию перевода:

component

import { TranslateService } from '@ngx-translate/core';
constructor(private translate: TranslateService) {}
ngOnInit() {
this.translate.get('FrontPage').subscribe((translated: string) => { // /Получить локализованные записи
this.pageTitle = translate;
});
}
this.translate.setTranslation('en', { // Добавить запись в локаль на ленту
'tab1.getStarted': 'Get Started', // добавить это
'someProperty': 'We can use translations in {{var}}' // 3
});

HTML

<ion-label>{{ "Inbox" | translate }}</ion-label>
<p translate [translateParams]="{ lang: language }">tab1.invite</p> <!-- добавить это -->

Это отобразит "Inbox" на английском языке.

Также в необходимо перейти в папку i18s и добавить переводимые элементы, по примеру: в ru.json "Inbox": "Входящие", в en.json "Inbox": "Inbox".