Spec-Zone.ru › Angular.js 1.5

Улучшить эту документациюМеждународная локализация (i18n) и локализация (l10n)

Международная локализация (i18n) — это процесс разработки продуктов таким образом, чтобы их можно было легко локализовать для разных языков и культур. Локализация (l10n) — это процесс адаптации приложений и текста для обеспечения их удобства использования в конкретном культурном или языковом сегменте рынка. Для разработчиков приложений международная локализация приложения означает абстрагирование всех строк и других данных, специфичных для определённого региона (например, форматов дат или валют), из приложения. Локализация приложения означает предоставление переводов и локальных форматов для абстрагированных данных.

Как Angular поддерживает i18n/l10n?

Angular поддерживает i18n/l10n для фильтров дат, чисел и валют.

Локализуемая множественная форма поддерживается с помощью ngPluralize директивы. Кроме того, вы можете использовать расширения MessageFormat для $interpolate локализуемой множественной формы и поддержки рода во всех интерполяциях с помощью модуля ngMessageFormat.

Все локализуемые компоненты Angular зависят от наборов правил, специфичных для региона, управляемых службой $locale.

Несколько примеров использования фильтров Angular с различными наборами правил для определённых регионов представлены в каталоге i18n/e2e исходного кода Angular.

Что такое идентификатор региона?

Регион — это конкретная географическая, политическая или культурная область. Наиболее часто используемый идентификатор региона состоит из двух частей: кода языка и кода страны. Например, en-US, en-AU, и zh-CN — это допустимые идентификаторы регионов, содержащие и код языка, и код страны. Поскольку указание кода страны в идентификаторе региона необязательно, идентификаторы регионов, такие как en, zh, и sk, также являются допустимыми. Более подробную информацию об использовании идентификаторов регионов см. на сайте ICU.

Поддерживаемые регионы в Angular

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

Обеспечение правил региона для Angular

Существует два подхода к предоставлению правил региона Angular:

1. Предварительно собранные наборы правил

Вы можете предварительно собрать нужный файл региона с Angular, объединив содержимое файла, специфичного для региона, в конец файла angular.js или angular.min.js.

Например, в *nix-системах, чтобы создать файл angular.js, содержащий правила локализации для немецкого региона, вы можете сделать следующее:

cat angular.js i18n/angular-locale_de-de.js > angular_de-de.js

При запуске приложения, содержащего angular_de-de.js скрипт вместо универсального скрипта angular.js, Angular автоматически настраивается с правилами локализации для немецкого региона.

2. Включение скрипта региона в index.html

Также можно включить файл js, специфичный для региона, в страницу index.html. Например, если клиенту требуется немецкий регион, вы обслуживаете index_de-de.html, который будет выглядеть примерно так:

<html ng-app>
 <head>
….
   <script src="angular.js"></script>
   <script src="i18n/angular-locale_de-de.js"></script>
….
 </head>
</html>

Сравнение двух подходов

Оба описанных выше подхода требуют подготовки различных index.html страниц или файлов JavaScript для каждого региона, который может использовать ваше приложение. Вам также необходимо настроить ваш сервер для предоставления правильного файла, соответствующего нужному региону.

Второй подход (включение файла JavaScript локализации в index.html) может быть медленнее, поскольку требуется загрузить дополнительный скрипт.

Ограничения

Хотя Angular упрощает i18n, при разработке приложения следует учитывать несколько моментов.

Символ валюты

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

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

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

{{ 1000 | currency }}

Если ваше приложение в настоящее время в регионе en-US, браузер отобразит $1000.00. Если кто-то из региона Японии (ja) просматривает ваше приложение, браузер отобразит баланс ¥1000.00 вместо этого. Это проблема, так как $1000 не то же самое, что ¥1000.

В этом случае вам необходимо переопределить символ валюты по умолчанию, предоставив фильтру валюты currency символ валюты в качестве параметра.

Если мы изменим вышеперечисленное на {{ 1000 | currency:"USD$"}}, Angular всегда будет отображать баланс USD$1000 независимо от региона.

Длина перевода

Длина переведенных строк/форматов дат может сильно различаться. Например, June 3, 1977 будет переведено на испанский как 3 de junio de 1977.

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

Временные зоны

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

Расширения MessageFormat

Вы можете записывать локализуемые сообщения с множественными формами и родами в выражениях интерполяции Angular и $interpolate вызовах.

Это расширение синтаксиса предоставляется модулем ngMessageFormat, от которого может зависеть ваше приложение (отдельно поставляется как angular-message-format.min.js и angular-message-format.js.) Нынешнее ограничение модуля ngMessageFormat, заключается в том, что он не поддерживает переопределение начального и конечного символов $interpolate. Разрешены только стандартные {{ и }}.

Синтаксическое расширение основано на подмножестве синтаксиса ICU MessageFormat, которое охватывает множественные формы и выбор рода. Обратитесь к ссылкам в разделе «Дополнительные материалы» внизу этого раздела.

При чтении объяснений ниже вам может быть полезно поэкспериментировать со следующим примером:

Синтаксис множественных форм

Синтаксис выбора сообщения на основе множественных форм выглядит следующим образом:

{{NUMERIC_EXPRESSION, plural,
    =0 {MESSAGE_WHEN_VALUE_IS_0}
    =1 {MESSAGE_WHEN_VALUE_IS_1}
    =2 {MESSAGE_WHEN_VALUE_IS_2}
    =3 {MESSAGE_WHEN_VALUE_IS_3}
    ...
    zero {MESSAGE_WHEN_PLURAL_CATEGORY_IS_ZERO}
    one {MESSAGE_WHEN_PLURAL_CATEGORY_IS_ONE}
    two {MESSAGE_WHEN_PLURAL_CATEGORY_IS_TWO}
    few {MESSAGE_WHEN_PLURAL_CATEGORY_IS_FEW}
    many {MESSAGE_WHEN_PLURAL_CATEGORY_IS_MANY}
    other {MESSAGE_WHEN_THERE_IS_NO_MATCH}
}}

Обратите внимание, что пробелы (включая переводы строк) обычно не имеют значения, за исключением случаев, когда они являются частью фактического текста сообщения, который находится в фигурных скобках. Пробелы обычно используются для улучшения читабельности.

Здесь NUMERIC_EXPRESSION — это выражение, которое вычисляется до числового значения, на основе которого должно меняться отображаемое сообщение в соответствии с правилами множественных форм.

После выражения Angular вы обозначите синтаксис расширения множественных форм с помощью элемента синтаксиса , plural,. Пробелы там необязательны.

За этим следует список ключевых слов выбора и соответствующих пар сообщений. Ключевое слово «other» и соответствующее ему сообщение являются обязательными, но вы можете иметь любое количество других категорий, которые вам нужны.

Ключевые слова выбора

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

Точные совпадения записываются как знак равенства, за которым следует точное значение. =0, =1, =2 и =123 — это примеры точных совпадений. Обратите внимание, что пробела между знаком равенства и числовым значением быть не должно.

Совпадения по категориям множественных форм — это отдельные слова, соответствующие категориям множественных форм спецификации категории множественных форм CLDR. Эти категории варьируются в зависимости от региона. Например, регион «en» (английский) определяет только «one» и «other», а регион «ga» (ирландский) определяет «one», «two», «few», «many» и «other». Обычно вы пишете категории для вашего языка. При переводе переводчики будут добавлять или удалять дополнительные категории в зависимости от целевого региона.

Точные совпадения всегда имеют приоритет над совпадениями по ключевым словам. Поэтому, если вы определите =0 и zero, когда значение выражения равно нулю, используется сообщение =0. (Дублированные ключевые слова категорий полезны при использовании необязательного синтаксиса offset , описанного далее).

Сообщения

Сообщения немедленно следуют за ключевым словом выбора и необязательно предваряются пробелами. Они записываются в одиночных фигурных скобках ({}). Они могут содержать синтаксис интерполяции Angular внутри них. Кроме того, символ # является заполнитель для фактического числового значения выражения.

{{numMessages, plural,
      =0 {You have no new messages}
      =1 {You have one new message}
   other {You have # new messages}
}}

Поскольку эти сообщения сами по себе могут содержать выражения Angular, вы также можете записать это следующим образом:

{{numMessages, plural,
      =0 {You have no new messages}
      =1 {You have one new message}
   other {You have {{numMessages}} new messages}
}}

Синтаксис множественных форм с необязательным смещением

Синтаксис множественных форм поддерживает необязательный синтаксис offset , используемый в сопоставлениях. Его проще объяснить на примере.

{{recipients.length, plural, offset:1
    =0    {You gave no gifts}
    =1    {You gave {{recipients[0].name}} a gift}
    one   {You gave {{recipients[0].name}} and one other person a gift}
    other {You gave {{recipients[0].name}} and # other people a gift}
}}

Когда указано offset , сопоставление работает следующим образом. Сначала точное значение выражения Angular сопоставляется с точными совпадениями (то есть, =N селекторами) для поиска совпадения. Если совпадение найдено, используется это сообщение. Если совпадение не найдено, значение выражения уменьшается на значение смещения, и для полученного нового значения применяются правила локализации множественных форм, чтобы получить его категорию множественной формы (например, «one», «few», «many» и т. д.). После этого выполняется попытка сопоставления с селекторами ключевых слов, и используется совпадающее сообщение. Если совпадение не найдено, используется категория «other» (обязательная). Значение символа # внутри сообщения равно значению исходного выражения, уменьшенному на значение смещения, указанного в выражении.

Экранирование/цитирование

Вам необходимо экранировать фигурные скобки или символ # внутри текстов сообщений, если вы хотите, чтобы они обрабатывались буквально, без специального значения. Вы можете заключить в кавычки/экранировать любой символ в тексте сообщения, поставив перед ним символ \ (обратный слэш). Символ обратного слэша удаляет любое специальное значение символа, который следует за ним непосредственно. Таким образом, вы можете экранировать или заключить в кавычки сам обратный слэш, поставив перед ним другой символ обратного слэша.

Синтаксис пола (select)

Поддержка пола обеспечивается более общим синтаксисом "select", который больше похож на оператор switch. Он достаточно универсален, чтобы поддерживать использование для сообщений, связанных с полом.

Синтаксис выбора сообщения, основанного на поле, выглядит следующим образом:

{{EXPRESSION, select,
    male {MESSAGE_WHEN_EXPRESSION_IS_MALE}
    female {MESSAGE_WHEN_EXPRESSION_IS_FEMALE}
    ...
    other {MESSAGE_WHEN_THERE_IS_NO_GENDER_MATCH}
}}

Обратите внимание, что пробелы (включая символы новой строки) обычно не имеют значения, за исключением случаев, когда они являются частью фактического текста сообщения, который находится в фигурных скобках. Пробелы обычно используются для улучшения читаемости.

Здесь EXPRESSION — это выражение Angular, которое вычисляется до пола человека, используемого для выбора сообщения, которое должно быть отображено.

За выражением Angular следует , select,, где пробелы являются необязательными.

За этим следует список ключевых слов выбора и соответствующих пар сообщений. Ключевое слово "other" и соответствующее сообщение являются обязательными, но вы можете иметь столько или так мало других значений пола, сколько вам нужно (т. е. это не ограничивается мужским/женским). Однако обратите внимание, что сопоставление выполняется с учетом регистра.

Ключевые слова выбора

Ключевые слова выбора — это простые слова, такие как "male" и "female". Ключевое слово "other" и соответствующее сообщение являются обязательными, а остальные — необязательными. Оно используется, когда выражение Angular не соответствует (без учета регистра) ни одному из других указанных ключевых слов.

Сообщения

Сообщения сразу следуют за ключевым словом выбора и необязательно предваряются пробелами. Они написаны в одинарных фигурных скобках ({}). Они могут содержать синтаксис интерполяции Angular внутри себя.

{{friendGender, select,
       male {Invite him}
     female {Invite her}
      other {Invite them}
}}

Вложенность

Как упоминалось в синтаксисе множественного и выбора, вложенные сообщения могут содержать синтаксис интерполяции Angular. Поскольку вы можете использовать расширения MessageFormat в интерполяции Angular, это позволяет вкладывать выражения множественного и пола в любом порядке.

Обратите внимание, что если эти сообщения предназначены для переводчика и должны быть переведены, рекомендуется, чтобы сообщения отображались целиком, а не были разделены.

Демонстрация вложенности

Это взято из приведенного выше примера.

{{recipients.length, plural, offset:1
    =0 {You ({{sender.name}}) gave no gifts}
    =1 { {{ recipients[0].gender, select,
              male {You ({{sender.name}}) gave him ({{recipients[0].name}}) a gift.}
              female {You ({{sender.name}}) gave her ({{recipients[0].name}}) a gift.}
              other {You ({{sender.name}}) gave them ({{recipients[0].name}}) a gift.}
          }}
       }
    one { {{ recipients[0].gender, select,
              male {You ({{sender.name}}) gave him ({{recipients[0].name}}) and one other person a gift.}
              female {You ({{sender.name}}) gave her ({{recipients[0].name}}) and one other person a gift.}
              other {You ({{sender.name}}) gave them ({{recipients[0].name}}) and one other person a gift.}
          }}
       }
    other {You ({{sender.name}}) gave {{recipients.length}} people gifts. }
}}

Отличия от синтаксиса ICU MessageFormat

Этот раздел будет полезен, если вы уже знакомы с синтаксисом ICU MessageFormat.

Это расширение синтаксиса, хотя и основано на MessageFormat, разработано для обратной совместимости с существующими выражениями интерполяции AngularJS. Основное правило таково: все интерполяции выполняются внутри двойных фигурных скобок. Оператор запятой верхнего уровня после выражения внутри двойных фигурных скобок приводит к распознаванию расширений MessageFormat. Такой оператор запятой верхнего уровня в противном случае является недопустимым в выражении Angular и используется MessageFormat для указания функции (например, множественного числа/выбора) и её связанного синтаксиса.

Чтобы понять расширение, ознакомьтесь с синтаксисом ICU MessageFormat, указанным в документации ICU. В любом месте MessageFormat, где у вас есть обычный текст сообщения, и вы хотите заменить выражение, просто поместите его в двойные фигурные скобки вместо одинарных фигурных скобок, которые диктует MessageFormat. Это имеет большое преимущество. Вы больше не ограничены простыми идентификаторами для замещений. Поскольку вы используете двойные фигурные скобки, вы можете вставить любое произвольное выражение интерполяции, включая вложенные выражения MessageFormat!

Дополнительная литература

Для получения более подробной информации, пожалуйста, обратитесь к нашей документации по проектированию. Вы можете узнать больше о синтаксисе ICU MessageFormat на странице форматирования сообщений | Руководство пользователя ICU.

© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.5.11/docs/guide/i18n

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API