Histórico da Página
Utilização
Para internacionalização (tradução e localização) é recomendado a adição de um AngularJS Filter registrado com o nome de i18n. Este filter deverá ser uma função que irá receber uma literal ou uma chave para tradução. Após a definição do mecanismo de internacionalização sua utilização se resume a:
| Bloco de código | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
{{ 'label-to-translate' | i18n }}
<label>{{ 'label-to-translate' | i18n }}</label>
<p>{{ 'label-to-translate' | i18n }}</p> |
...
| Bloco de código | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
{{ 'Olá !!' }}
<label>Olá !!</label>
<p>Olá !!</p> |
...
| Bloco de código | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
app.run(['$rootScope', '$filter', function ($rootScope, $filter) {
// Adiciona o filtro de i18n, caso exista, ao $rootScope para facilitar o acesso
// ao mesmo programaticamente.
if ($filter('i18n')) {
$rootScope.i18n = $filter('i18n');
}
}]); |
...
| Bloco de código | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
sampleService.$inject = ['$rootScope'];
function sampleService($rootScope) {
this.label = $rootScope.i18n('label-to-translate');
} |
- Link para o demo ???
Definição
Cada produto é livre para definir a forma como irá gerenciar suas traduções. No entanto, o TOTVS | HTML Framework confia que o AngularJS Filter seja registrado com o alias de i18n e que receba como parâmetro a palavra ou código a ser traduzido.
...
Usando o cadastro de clientes como exemplo teríamos o arquivo de tradução na seguinte estrutura:
- /datasuldts/crm/i18n/translations.js
...
No caso da aplicação de referencia o filtro foi concebido para inicialmente buscar a tradução no contexto que está sendo acessado. Caso não encontre recorre ao arquivo de tradução da aplicação centralizadora. Desta forma, podemos evitar de replicar traduções comuns como 'sim', 'atenção', 'não' entre outros.
| Informações |
|---|
É possível definir um contexto diferente do contexto atual ou da aplicação centralizadora. Veja mais abaixo. |
Cada arquivo de tradução se resume a um arquivo JSON com o nome de translations.js, este por sua vez deve seguir a estrutura padrão de um arquivo do JSON no qual temos a seguinte formatação:
| Bloco de código | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|
| ||||||||||
[{
"sample" : {
"pt":"Sample",
"en":"Sample",
"es":"Sample"
},
"label-to-translate" : {
"pt":"Palavra ou sentença a ser internacionalizada !",
"en":"Word or sentence to be internationalized !",
"es":"Palabra o frase que se internacionalizaron !"
}
}] |
...
No caso de não encontrar uma tradução para a palavra ou sentença a retorna entre colchetes para que fique visível que está pendente de tradução.
| Informações |
|---|
Caso o filtro encontre a literal, mas não encontre a tradução requisitada, não será disparado nenhum erro, apenas será retornado o próprio nome da literal. |
Literais com parâmetros
| Bloco de código | ||||||
|---|---|---|---|---|---|---|
| ||||||
[{
"salutation" : {
"pt":"Olá {0}, {1}",
"en":"Hi {0}, {1}"
}
}] |
Para passar os parâmetros para o filtro, passe um array como segundo parâmetro.
| Bloco de código | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
{{ 'salutation' | i18n: ['José', 'Bom dia'] }}
<label>{{ 'salutation' | i18n: ['José', 'Bom dia'] }}</label>
<p>{{ 'salutation' | i18n: ['José', 'Bom dia'] }}</p> |
Especificando um Contexto para tradução
Durante o desenvolvimento de alguns módulos foi levantada a necessidade de especificar o módulo que contenha a tradução correta ou contextualizada para a sentença a ser traduzida.
Desta forma foi adicionado um parâmetro ao filtro de i18n que permite que seja informado de qual contexto a sentença deve buscar sua tradução. Exemplo:
| Bloco de código | ||||||||
|---|---|---|---|---|---|---|---|---|
| ||||||||
{{ 'label-to-translate' | i18n: []: 'linha/meu-modulo' }}
<label>{{ 'label-to-translate' | i18n: []: 'linha/meu-modulo' }}</label>
<p>{{ 'label-to-translate' | i18n: []: 'linha/meu-modulo' }}</p> |
Ao especificar o terceiro parâmetro como 'meu-modulo' o filtro de i18n vai desconsiderar o contexto atual e para essa sentença em especial vai buscar no arquivo de tradução do 'meu-modulo'.