2014-07-10 5 views
10

Ich werde eine Webapp mit Polymer erstellen. Für diese Webapp brauche ich eine Lokalisierung. Gibt es einen Polymer-Weg zur Lokalisierung? Hat jemand jemals eine Lokalisierung in einer Polymer Webapp gemacht?Lokalisierung in Polymer?

+0

Ich benutze L20n. Überprüfen Sie hier: http: //stackoverflow.com/questions/35677198/tutorial-solution-for-node-js-polymer-i18n-based-on-l20n-library – AlexNasonov

Antwort

0

Ich habe eine Implementierung auf eigene Faust erstellt. Wenn ich schaue, was ich gemacht habe, ist es nicht so schwierig.

13

I18n und l10n sind auch auf meiner To-do-Liste. Zur Zeit portiere ich eine App von AngularJS zu Polymer. Das Backend ist Ruby on Rails. Ich verwende das Juwel i18n-js, das die Rails-Übersetzungsdateien (en.yml, de.yml usw.) in eine große JavaScript-Datei konvertiert, die ein I18n Objekt mit allen Übersetzungen enthält. Dieses Schmuckstück bietet auch eine JavaScript-Bibliothek zum Ausführen von Textübersetzungen und Wertlokalisierungen. Aber es gibt andere JavaScript-Bibliotheken, die ähnliche Funktionen bieten.

Das aktuelle Gebietsschema wird aus der Antwort einer HTTP-Anforderung festgelegt und gibt die Benutzer Accept-Language header zurück.

Nichts Polymer spezifisch bis zu diesem Punkt.

Ich habe dann eine Reihe von globalen Polymer-Ausdruck-Filter erstellt, die die verschiedenen Gebietsschema-Transformationen auf ihren Eingabe-Strings durchführen. Dies ist die gleiche Methode wie die, die ich in einer AngularJS-Anwendung gelernt habe. Der Übersetzungsfilter sieht wie folgt aus (I18n.t ist die Übersetzungsfunktion der JavaScript-Bibliothek)

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

und gleicht so verwendet

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

Ein Datum Lokalisierung als

geschrieben werden kann
{{ someDate | i18n_date('short') }} 

Ich habe die i18n-Filter und zusätzliche Hilfsfunktionen in ein Polymer-Element gepackt, also kann ich dieses Element auch in ein anderes Element einfügen und die Übersetzungsfunktion verwenden ns aus seinem JavaScript-Code.

Das i18n-Element ist auch in meinem Haupt-App-Element enthalten, wo es die I18n-Bibliothek initialisiert und das Standard-Gebietsschema und das aktuelle Gebietsschema einstellt.

+0

Das sieht gut aus! Wirst du dein Paket auf GitHub setzen? –

+0

@dirk das klingt großartig. Kannst du den Code mit der Welt teilen? Es ist nicht viel da draußen. –

0

Nicht bewusst, eine Polymer -way macht i18n, ich schlage vor, dass Server-Seite zu tun.

Wenn das Framework Spring ist, würde ich die benutzerdefinierten Elemente als JSP implementieren und die i18n wie üblich mit den Tags <spring:message /> behandeln.

Einziger Vorbehalt ist, dass das Umschalten der Sprache der Anwendung ein vollständiges Neuladen erfordert. Aber da Sprachwechsel normalerweise nicht oft gemacht werden, halte ich das nicht für ein Problem.

0

Für Polymer 1.0 habe ich gerade ein einfaches (stark in Entwicklung befindliches) Element veröffentlicht (siehe gitlab oder lies darüber here).Er lädt die Übersetzungsdateien asynchron und die Nutzung ist ziemlich einfach:

<!-- 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> 

Jetzt haben Sie es auf verschiedene Weise nutzen:

  • In berechneten Eigenschaften: fügen Sie einfach I18N als Element behavior und Ihre Daten übersetzen Bindungen, z {{__('hello')}}
  • Im globalen Kontext verwenden Sie einfach I18N Objekt, z. I18N.__('hello')