Localizzazione in polimero?

Question

Ho intenzione di creare una webapp con Polymer. Per quella webapp ho bisogno di localizzazione. C'è un modo Polymer per fare la localizzazione? Qualcuno ha mai fatto localizzazione in una webapp Polymer?

Answer 1

Ho creato un'implementazione per conto mio. Guardando quello che ho fatto non è così difficile da fare.

Answer 2

I18n e l10n sono anch'essi sulla mia lista di cose da fare. Attualmente sto eseguendo il porting di un'applicazione da AngularJS a Polymer. Il back-end è Ruby on Rails. Io uso la gemma i18n-js che converte i file di traduzione di Rails (en.yml, de.yml e così via) in un unico grande file JavaScript contenente un oggetto I18n con tutte le traduzioni. Questa gemma fornisce anche una libreria JavaScript per eseguire traduzioni di testo e localizzazioni di valori. Ma ci sono altre librerie JavaScript che forniscono funzionalità simili.

Le impostazioni internazionali correnti vengono impostate dalla risposta di una richiesta HTTP, restituendo gli utenti Intestazione Accept-Language.

Nothing Polymer specifico fino a questo punto.

Ho quindi creato un gruppo di filtri di espressione Polymer globali che eseguono le varie trasformazioni locali sulle loro stringhe di input. Questo è lo stesso metodo che ho imparato ad usare in un'applicazione AngularJS. Il filtro di traduzione si presenta come segue (I18n.t è la funzione di traduzione della libreria JavaScript)

PolymerExpressions.prototype.i18n = function(key) { 
    return I18n.t(key); 
}; 

ed è usato in questo modo

<paper-button label="{{ 'action.help' | i18n }}"></paper-button> 

una localizzazione data può essere scritto come

{{ someDate | i18n_date('short') }} 

Ho confezionato i filtri i18n e le funzioni di supporto aggiuntive in un elemento Polymer, quindi posso anche includere questo elemento in un altro elemento e utilizzare la funzione di traduzione ns dal suo codice JavaScript.

L'elemento i18n è anche incluso nel mio elemento principale dell'app dove inizializza la libreria I18n e imposta le impostazioni locali predefinite e correnti.

Answer 3

Non essendo a conoscenza di un Polymer -way che fa i18n, suggerisco di fare quello lato server.

Nel caso in cui il framework sia Spring, implementerei gli elementi personalizzati come jsp e gestisco i18n come al solito con i tag <spring:message />.

Unica avvertenza è che il passaggio alla lingua dell'applicazione richiederebbe una ricarica completa. Tuttavia, poiché il cambio di lingua non viene fatto spesso, non penso che questo sia un problema.

Answer 4

Per Polymer 1.0 Ho appena pubblicato un elemento semplice (in fase di sviluppo) (consultarlo su gitlab o leggere su di esso here).Si carica i file di traduzione in modo asincrono e l'utilizzo è abbastanza semplice:

<!-- Import it in head --> 
<link rel="import" href="bower_components/quaintous-i18n/quaintous-i18n.html"> 
<!-- initialize it in body --> 
<quaintous-i18n locales-path="/locales/fa.json"></quaintous-i18n> 

Ora è possibile utilizzare in vari modi:

• Nelle proprietà calcolate: basta aggiungere I18N come vostro elemento behavior e tradurre i dati legature, ad es {{__('hello')}}
• Nel contesto globale utilizzare solo l'oggetto I18N, ad es. I18N.__('hello')

Answer 5

Usa Polymer.AppLocalizeBehavior

https://github.com/PolymerElements/app-localize-behavior

Sto usando questo comportamento in PWA Modello per locali per elemento personalizzato.

https://github.com/StartPolymer/progressive-web-app-template