Угловой 6 - i18n против ngx-translate - PullRequest
0 голосов
/ 28 июня 2018

Я работаю над большим проектом, использующим Angular 6. Этот проект нуждается в значительной интеграции i18n. Я пытаюсь принять правильное решение относительно того, как поступить.

Я вижу, что могу выбирать между:

  1. ngx-translate (https://github.com/ngx-translate/core)
  2. Угловой i18n (https://angular.io/guide/i18n)

Я склоняюсь к выбору варианта 2; Angular's i18n. Это потому, что это собственный встроенный пакет Angular, который лучше подходит мне. По-видимому, это также лучше для SEO и немного лучше для производительности без каких-либо обходных путей. Кроме того, теперь он выпущен, я думаю, что ngx-translate может быть устаревшим. Много информации здесь: Угловая 5 интернационализация .

Однако вот мои оговорки:

  • По-видимому, версия Angular довольно новая / все еще догоняет (https://github.com/ngx-translate/core/issues/495). Она слишком новая, чтобы взять ее на вооружение?
  • По-видимому, у меня должна быть отдельная сборка веб-сайта для каждого языка (https://angular.io/guide/i18n#template-translations)??? Я действительно не думаю, что это было бы хорошо. Это правда? Или это так, что файлы шаблона вставляются динамически каждый раз? Я знаю, что с помощью ngx-translate переведенные слова просто сохраняются в файлах .json - мне нравится аккуратность этого. Я не думаю, что нам нужна куча разных сборок веб-сайтов.

Есть ли способ сделать живое переключение языков с помощью angular i18n? т.е. переключение языка на странице без перезагрузки / повторной загрузки данных с сервера? Это то, что они называют JIT?

Кто-нибудь пробовал https://github.com/robisim74/angular-l10n? также выглядит очень хорошо.

Большое спасибо. С наилучшими пожеланиями.

Ответы [ 4 ]

0 голосов
/ 05 февраля 2019

Одним из больших преимуществ Angular I18N является то, что его влияние на шаблоны минимально. Вам нужно только добавить атрибут i18n для каждого элемента, который вы хотите локализовать. Так

<p>Hello World<p>

становится

<p i18n>Hello World<p>

Нет необходимости много менять разметку и не нужно вручную поддерживать файл ресурсов. Если вы используете любую другую библиотеку I18N для Angular или React, вам нужно изменить свою разметку, например

<p>Translate("Hello World")<p>

и вам нужно вручную добавить строку в файл нейтральных ресурсов, такой как

"Hello World": "Hello World"

Тогда, если вы хотите изменить строку, вы также должны запомнить, чтобы обновить ключ и значение в файле ресурсов.

В Angular I18N вы используете инструмент извлечения для создания и поддержки файлов нейтральных ресурсов.

В Angular I18N в настоящее время отсутствует возможность локализовать строку в исходном коде. Однако эта функция скоро появится.

0 голосов
/ 09 октября 2018

Обсуждение все еще продолжается, и здесь вы можете найти некоторые ответы и мнения, даже непосредственно от разработчиков Angular: https://github.com/ngx-translate/core/issues/495

Лично я бы структурировал приложение с официальным i18n и в конце концов добавил бы некоторый выделенный перевод в код с библиотекой ngx-translate.

Есть ли способ сделать живое переключение языков с помощью angular i18n?

На самом деле, есть. Вам нужно создать другой дистрибутив вашего приложения, но после полного развертывания вы можете переключиться в режим реального времени:

Официальные документы по Angluar и рекомендуемое руководство

0 голосов
/ 21 января 2019

Понятно, почему разработчики, как библиотека ngx-translate, заботятся о интернационализации. В конце концов, это делает нашу жизнь настолько легкой, превращая задачу перевода в отображение 1 на 1. К сожалению, это не так, как это работает с человеческими языками. У одного есть два человека, которые знают более одного языка, чтобы лучше понять недостатки этого подхода.

Вот небольшой пример: Допустим, у вас есть приложение для командировочных расходов, у вас есть табличное представление, в котором заголовок одного столбца - «время», указывающее, когда были сообщены расходы. Затем представьте, что в таком приложении у вас есть мини-калькулятор для базовой проверки ваших расходов, в котором есть кнопка умножения x с отложенным сообщением «время». Когда вы делаете ngx-translate, вы извлекаете их обоих с одним и тем же ключом «TIMES», который, в свою очередь, переводчик возвращает вам один перевод. Но первое вхождение «время» не обязательно переводится так же, как и второе, во всех других языках. Возьмите, например, испанский:

  • "два раза три" (как в калькуляторе) -> "dos POR tres"
  • «ВРЕМЯ расхода» (как в табличном представлении) -> «TIEMPOS de gasto»

Именно поэтому интернационализация движется в направлении использования более сложного формата, такого как XLF, для поддержки значения, описания (в случае Angular), а не старого стиля JSON с 1 глубиной, который не может быть приспособлен для перевода в отношении в контекст.

Теперь вы можете утверждать, что это можно решить, зарегистрировав два разных ключа для «времен», которые на английском языке соответствуют одной и той же вещи, но для этого вам, как разработчику, необходимо знать все языки, которые ваше приложение поддерживает при разработке, или вы пришлось бы пройти еще одну итерацию (время - деньги!), чтобы получить обратную связь с клиентом, а затем добавить отдельный ключ, тогда как если вы предоставите описание и значение для вашего сообщения (текста), то переводчик позаботится о вас для вас, не имея никаких знаний другого языка (Если вы знаете испанский, подумайте о том, насколько сложным это может быть с сослагательными и указательными формами глагола, которые одинаковы в английском, но не в испанском).

Чтобы ответить на ваш другой вопрос «Есть ли способ сделать живое переключение языков с помощью angular i18n?»: Да, есть. Взгляните на эту замечательную статью об управлении состоянием в приложениях. Короче говоря, вам нужно, чтобы ваш клиент и постоянные состояния отображались в URL. Тогда все, что вам нужно сделать, это добавить префикс локали к вашему пути, чтобы ваш веб-сервер дал вам правильную сборку локали. Тогда, каким бы ни было состояние вашего приложения до изменения действия по изменению локали, его можно восстановить из URL (поскольку оно «отражает как постоянное состояние, так и состояние клиента»).

0 голосов
/ 28 июня 2018

Это слишком новое, чтобы взять на себя?

Это основано на мнении и, следовательно, не по теме

Видимо у меня должен быть отдельный сайт

Вам необходимо отдельное приложение (т.е. index.html + bundles). Но вы можете обслуживать все эти приложения по одному URL-адресу, решая, какое из них будет работать на сервере. Это (надеюсь) изменится с Angular 7, когда станет доступен новый динамический i18n, построенный поверх Ivy.

это тот случай, когда файлы шаблона вставляются динамически каждый раз?

Не уверен, что вы имеете в виду. Переводы локали, для которой вы строите, хранятся в сгенерированных шаблонных классах во время компиляции компилятором Angular AOT.

Есть ли способ сделать живое переключение языков с помощью angular i18n?

Нет, и это не будет возможно в следующей версии i18n. Одно и то же уникальное приложение сможет работать на нескольких языках, но этот язык все равно придется выбирать при запуске, и вам придется перезапустить приложение, чтобы выбрать другой язык.

Есть ли способ сделать живое переключение языков с помощью angular i18n?

Нет. По крайней мере, не эффективно.

Это то, что они называют JIT?

Нет. JIT-компилятор - это то, что компилирует ваши HTML-шаблоны в JavaScript при запуске в браузере. В производстве вы используете компилятор AOT (который также используется для интеграции переводов в сгенерированные классы JS), который выполняет аналогичную компиляцию шаблонов, но во время сборки, а не во время выполнения.

...