1. I18N y L10N en Angularjs
1. ¿Qué son I18N y L10N?
La internacionalización, denominada I18N, es un estándar para el desarrollo de productos de una manera que simplemente puedan localizar el lenguaje y la cultura del producto. La localización, denominada L10N, es un estándar que permite que las aplicaciones y textos se adapten a mercados culturales o de idiomas especiales. Para los desarrolladores de aplicaciones, internacionalizar un programa significa que todas las cadenas y otras áreas deben extraerse del programa donde son más especiales (como formatos de fecha y moneda). La localización de un programa significa proporcionar traducción y formato localización de bloques extraídos de i18n.
2. ¿Qué niveles de I18N y L10N son compatibles actualmente por Angular?
Actualmente, Angular proporciona soporte I18N y L10N para filtros de fecha y hora, número y moneda.
Además, Angular admite la localización diversificada a través de la Directiva Ngpluralize (http://docs.angularjs.org/api/ng.directive:ngpluralize).
Todos los controles localizables se basan en el conjunto de reglas de características de configuración local administrada a través del servicio $ local.
Para permitir que los lectores vean ejemplos reales, el funcionario ha preparado algunos ejemplos de la página web para mostrar cómo usar filtros angulares para recopilar variables a través de las reglas de la región. Podemos encontrar ejemplos correspondientes en GitHub (https://github.com/angular/angular.js/tree/master/i18n/e2e) o en i18n/e2e en el paquete de desarrollo angular.
3. ¿Qué es una identificación regional?
La ubicación es una región geográfica, política y cultural específica. La ID local más utilizada consta de dos partes: código de idioma y código de país. Por ejemplo, EN-US, EN-AU y ZH-CN son todas ID de locales válidas, todas que contienen códigos de idiomas y códigos de país. Debido a que la codificación del país especificada en la ID de locales es opcional, las ID de locales como EN, ZH y SK son todos válidos. Visite el sitio web de la UCI (http://userguide.icu-project.org/locale), donde hay más información sobre la ID de locales.
4. Local de soporte angular soportado
Angular separa el conjunto de reglas para números, formatos de fecha y hora en diferentes archivos, cada archivo tiene un área única. Podemos encontrar la lista de localidad actualmente compatible aquí (https://github.com/angular/angular.js/tree/master/i18n/locale)
2. Personalizar las reglas locales en Angular
Hay dos formas de personalizar el lugar en Angular:
1. Conjuntos de reglas previamente bundados
Podemos implementar el archivo local esperado conectando el archivo específico de la configuración regional a angular.js o angular.min.js.
Por ejemplo, en *nix, podemos crear un archivo angular.js que contenga las reglas de localización regional alemana a través del siguiente comando:
Cat Angular.js I18N/Angular-Locale_de-Ge.js> Angular_de-Ge.js
Cuando la aplicación usa el script Angular_de-Ge.js en lugar del script general Angular.js, Angular comienza automáticamente reglas de localización preconfiguradas (preconfiguradas) en Alemania.
2. Incluya el script JS JS en la página index.html
También podemos incluir archivos JS en el área especificada en la página. Por ejemplo, si un cliente requiere un archivo regional alemán, podemos proporcionar una página como la siguiente:
<html ng-app> <head> ... <script src = "angular.js"> </script> <script src = "i18n/angular-leocale_de-ge.js"> </script> ... </head> ... </html>
Ambos métodos anteriores requieren que proporcionemos diferentes páginas de índice.html o archivos JS en cada región para la localización. También necesitamos configurar nuestro servidor para proporcionar los archivos locales correctos y deseados.
Sin embargo, el segundo método (incluidos los archivos locales en la página) será más lento porque se requiere un script más para cargarse. (-_- !!!).
3. Trap ("Gotchas")
1. Trap de símbolo de divisas
El filtro de divisas de Angular nos permite usar el símbolo de moneda predeterminado del servicio local, y también podemos proporcionar símbolos de moneda personalizados. Si nuestra aplicación solo se usa en una región, entonces podemos confiar (establecer) el símbolo de moneda predeterminado. Sin embargo, si esperamos que los usuarios en otras regiones también usen nuestra aplicación, deberíamos proporcionar nuestros símbolos de moneda personalizados para garantizar que el usuario comprenda el valor real.
Por ejemplo, si queremos unir el filtro de moneda para mostrar el saldo de la cuenta de RMB 1,000: {{1,000 | moneda}}, y nuestra aplicación actualmente está utilizando la configuración regional EN-US, luego se mostrará "$ 1,000.00". Sin embargo, si los usuarios en otras regiones (como China continental) visitan nuestra aplicación, el navegador del usuario especificará la configuración de la región a "China continental", y el saldo se mostrará como "￥ 1000.00" (un error muy triste, tipo de cambio ...).
En este ejemplo, cuando necesitamos establecer el filtro, necesitamos reescribir el símbolo de moneda predeterminado proporcionando símbolos de divisas como parámetros para el filtro de divisas (http://docs.angularjs.org/api/ng.filter: currency), el parámetro como: USD $. De esta manera, Angular ignorará cualquier cambio en la ubicación y seguirá mostrando el saldo como "USD $ 1000.00".
2. Trap de longitud de traducción
Recuerde, al traducir cadenas y formatos de eventos, la longitud puede variar mucho. Por ejemplo, "3 de junio de 1977" se convierte en "3 de Junio de 1977" cuando se traduce al español. Por supuesto, puede haber situaciones más extremas. Por lo tanto, cuando internacionalizamos la aplicación, necesitamos configurar las reglas CSS correspondientes y realizar pruebas integrales para garantizar que los componentes de la interfaz de usuario no colapsen (variantes).
3. Zona horaria
Recuerde, el filtro de fecha de fecha de Angular utiliza la zona horaria establecida por el navegador. Por lo tanto, la misma aplicación mostrará información de tiempo diferente de acuerdo con la configuración de la zona horaria de la computadora que ejecuta la aplicación, en lugar de la zona horaria especificada por el desarrollador en JavaScript o Angular.