spanish ngx ng2 i18n internationalization angular

internationalization - ng2 - ngx-translate angular 4



Angular2 i18n en este punto? (6)

El soporte para i18n ahora es oficial en Angular 2 RC6

Blog de lanzamiento oficial:
https://angularjs.blogspot.nl/2016/09/angular-2-rc6_1.html

Una muestra de internacionalización con Angular 2 RC6
https://github.com/StephenFluin/i18n-sample

Más información sobre cómo funciona el nuevo concepto de i18n en angular2:
https://lingohub.com/blog/2015/03/angular-2-i18n-update-ng-conf-2015

Decidimos darle un giro y comenzamos un proyecto nuevo usando Angular2. Hasta aquí todo bien, pero en este momento estamos enfrentando un problema. En este punto, ¿cuál es el enfoque adecuado para i18n para Angular2? Investigamos un poco y encontramos esto:

Sin embargo, el último compromiso tiene más de 5 meses de antigüedad ... No parece un desarrollo activo.

¿Alguien intentó usar angular-translate o angular-gettext? ¿O tal vez con Angular2 es mejor ajustar algo JS como i18next? ¿Alguien podría compartir sus pensamientos? Tal vez enfrentaste el mismo problema?


Encontré otra manera de implementar esto usando pipe y service

HTML

<!-- should display ''hola mundo'' when translate to Spanish --> <p>{{ ''hello world'' | translate }}</p>

MECANOGRAFIADO

... // "this.translate" is our translate service this.translate.use(''es''); // use spanish ... // should display ''hola mundo'' when translated to Spanish this.translatedText = this.translate.instant(''hello world''); ...

https://scotch.io/tutorials/simple-language-translation-in-angular-2-part-1 https://scotch.io/tutorials/simple-language-translation-in-angular-2-part-2


Estoy armando un POC y la documentación oficial es engorrosa, por decir lo menos, así que probé ngx-translate http://www.ngx-translate.com/ y literalmente tuve el mundo hello funcionando en pocos minutos, hay algunas advertencias:

  1. He leído acerca de gente quejándose sobre el rendimiento, debido a las tuberías, pero al leer los problemas de Github, parece que se está resolviendo
  2. Solo para i18n o Translations no trata con i10n o Localization
  3. Hay pocos errores de advertencia con Angular4 pero funciona de todos modos

En resumen, me gustó ngx-translate si tienes una aplicación pequeña y solo necesitas traducción

Yo personalmente quería la localización, así que estoy viendo https://github.com/robisim74/angular-l10n . Se ve bastante bien, pero no lo he probado, así que te lo haré saber más tarde, o ustedes pueden ir y todos lo intentamos



Plunk se actualizó a Angular 2 Final : https://plnkr.co/edit/4euRQQ . Las cosas parecen funcionar igual que en RC7.

Se ha agregado una nueva sección i18n a los documentos oficiales de Angular 2. Básicamente, explica en detalle lo que sucede en el plunkr anterior.

XLIFF es el único formato para traducciones, sin soporte json . Se debe crear un archivo fuente de traducción (xliff, xlf) utilizando la herramienta ng-xi18n :

package.json :

"scripts": { "i18n": "ng-xi18n", ... }

y

npm run i18n

Consulte la sección de traducción de Merge para obtener detalles sobre la fusión de una traducción en una plantilla de componente. Se hace usando el complemento de texto SystemJS .

Otro ejemplo usando Gulp http://www.savethecode.com/angular2-i18n-native-support/

Personal anterior : actualización basada en RC7 y enlaces proporcionados por Herman Fransen :

He hecho un ejemplo mínimo de Plunkr: https://plnkr.co/edit/4W3LqZYAJWdHjb4Q5EbM

Comentarios a la plunkr:

  • bootstrap debe proporcionar TRANSLATIONS , TRANSLATIONS_FORMAT , LOCALE_ID con valores -> setup translations
  • los elementos traducibles en html-templates deben usar la directiva i18n
  • las traducciones se almacenan en el archivo .xlf . Los enlaces entre idiomas se realizan a través de Id , se vincula con html por un valor de etiqueta <source> en xlf
  • actualmente los archivos xlf no se usan directamente; un archivo .ts se crea manualmente para envolver el contenido de xlf en una variable exportable. Supongo que esto debería funcionar automágicamente en la versión final (tal vez incluso ahora).

Este es el primer enfoque oficialmente documentado que encontré. Sin embargo, todavía es apenas utilizable. Veo los siguientes problemas en la implementación actual:

  • El idioma está configurado en el bootstrap , no se puede cambiar en tiempo de ejecución. Esto debería cambiarse en Final.
  • Id de un elemento traducible en xlf se genera SHA. La forma actual de obtener esta identificación es un poco desordenada: crea un nuevo elemento traducible, i18n.lang.xlf , copie SHA id del error y pegue en su archivo i18n.lang.xlf .

Hay una gran solicitud de extracción de documentación sobre i18n

Personal de más edad : notas de la versión https://github.com/angular/angular/blob/master/CHANGELOG.md tienen un registro

i18n : fusionar traducciones 7a8ef1e

Una gran parte de i18n se introdujo en Angular 2 RC5

Desafortunadamente, todavía no hay documentación disponible.


Todos están ansiosos por la implementación oficial, pero esta funcionó para mi caso de uso: ng2-translate

README es bastante minucioso, y si necesita algo realmente particular (para mí fue la división de código), el código en sí no es demasiado largo o difícil de leer.