Документация

Компонент <t>

Поместите содержимое в компонент <t>, и оно будет переведено. Оригинальный контент отображается до тех пор, пока его перевод не будет загружен.

<t>This content will be translated</t>

Текст с привязками тоже работает. Содержимое снова переводится всякий раз, когда оно меняется, например, при изменении name:

<t>Hello {{ name() }}</t>

Все переводы, запрошенные одновременно, отправляются в API одним запросом, а переводы кэшируются. Вы можете использовать столько компонентов <t>, сколько захотите.

<mt-translate> работает как альтернативный селектор, а Translate является тем же компонентом, что и T.

Входы

ВводТипОписание
formality'informal' | 'formal'Устанавливает формальность перевода.
langLanguageПереопределяет установленный язык с помощью provideMagicTranslate.
<t lang="fr" formality="formal">How are you?</t>

Ограничения

Ограничений очень мало:

  1. Компоненты Angular нельзя помещать в компонент <t>. Подойдут простые HTML-элементы (см. пример ниже). Переведенная разметка проходит дезинфицирующее средство HTML Angular.
  2. Содержимое компонента <t> не может превышать 10 КБ, что составляет около 5000 символов.
<!-- this is OK, since <a> is a plain HTML element -->
<t>
<a href="mailto:info@i42.ch">Please send us an email</a>
</t>
<!-- this does NOT work, since <app-button> is an Angular component -->
<t>
<app-button>Click me</app-button>
</t>

Для перевода атрибутов и других строк используйте t pipe.