Die Lokalisierung mit Vorlagen require.js, backbone und underscore

Diese Frage ist über das templating und die Lokalisierung mit require.js und Unterstrich Vorlagen durch backbone.js. Die Anwendung muss lokalisiert werden on-the-fly.

Bevor Sie sich auf einen Weg, der sich später als problematisch erweisen, gibt es eine bessere Lösung als die, die ich überlege mir, - ich bin besorgt über die Geschwindigkeit und der Speicher mit immer wieder Zusammenführen, aufbereiten und die Sprache-array. Davon ausgehen, dass ein 2-3 tausend Zeichenketten.

Aktuellen Ansatz (funktioniert, sieht aber Prozessor-heavy):

Mit der I18N Bündelung AnsatzSprache anlegen "enthält", die im wesentlichen enthalten die übersetzten Elemente für alle Vorlagen
Verschmelzen diese Objekt/array von Elementen mit model-Attributen (von Rückgrat) und übergeben Sie die zusammengeführte Menge in die Unterstrich-Vorlage

define(['backbone', 'models/model', 'text!template.html', 'i18n!my/nls/translatedbits'],
  function(Backbone, MyModel, TemplateText, TranslationObject) {
  var View = Backbone.View.extend({
    model: {},

    initialize : function(params) {
      this.model = new MyModel();
    },

    render : function(callBack) {
      //Get the model attributes
      var templateParams = _.clone(this.model.attributes);
      //Bolt on the tranlsated elements (established from require.js I18N plugin)
      templateParams.t = TranslationObject;
      //Pass the lot ot the template
      var template = _.template(TemplateText, this.model.attributes);
      $(this.el).html( template );
      return this;
    }

  });
  return View;
  }
);

Dann die Vorlage gelesen

<%= modelAttribute1 %> <%= t.translationString1 %>

Gibt es eine bessere Lösung oder eine bessere Template-engine? [Besser für diesen Zweck - Schnurrbart haben vielleicht andere Vorteile, aber kann es lokalisieren leichter, oder kann es cache lokalisiert Ergebnisse erlauben von Modell-Parametern, die übergeben werden, in späteren?]

Beachten Sie, dass Sprachen möglicherweise geändert werden müssen "on the fly" - und das ist eine weitere Sorge, die ich habe mit dem I18N-plugin. Ich kann am Ende immer die transations von JSON-Anforderung durch einen template-Modell, aber dies erfordert ein Zusammenführen von Objekten, die ist, was ich versuche zu vermeiden.

InformationsquelleAutor der Frage Robbie | 2012-10-10

13

Hier bin ich derzeit dabei (nur open-Source, da es scheint, für andere nützlich)

underi18n ist eine sehr minimale lib für das tun von i18n auf templates und code.

Es bietet:
- Einfache Umwandlung gettext Kataloge zum json-format.
- Unterstützung für die Variablenersetzung in strings zu übersetzen.
Tut es nicht Umgang mit Pluralisierung.

Aus der README:

Kataloge

under18n verwendet eine einfache JSON-format für Kataloge, nach dem standard gettext - format. Im folgenden Beispiel
```
{
    'Developer': 'Προγραμματιστής',
    'Role ${role} does not exist in ${context}': 'Ο ρόλος ${role} δεν υπάρχει στο ${context}'
}
```
wir haben zwei strings zu übersetzen, das zweite mit zwei Variablen role und context.
Ein einfaches python-Skript wird bereitgestellt, um Ihnen helfen zu konvertieren standard - .mo - Dateien in das JSON-format.

Nutzung

Erstellen Sie eine MessageFactory aus einer json-i18n-catalog:
```
var t = underi18n.MessageFactory(catalog);
```
Können Sie jetzt übersetzen inline:
```
t('Developer') //returns "Προγραμματιστής"

t('Role ${role} does not exist in ${context}', {role: 'διαχειριστής', context: 'πρόγραμμα'})
//Returns "Ο ρόλος διαχειριστής δεν υπάρχει στο πρόγραμμα"
```
Vorlagen

In der Regel Variablen in den templates angegeben sind, mit einigen Trennzeichen. Im Schnurrbart zum Beispiel {{ var }} verwendet wird, in der Erwägung, dass <%= var %> ist standardmäßig der Unterstrich. Wir verwenden den gleichen Ansatz, um anzuzeigen, übersetzbaren strings. Sie können geben Sie die Trennzeichen für die zu übersetzenden Texte als RegExp, sowie die Links - /rechts-Trennzeichen verwendet, die von Ihrem template-Sprache der Wahl in under18n.templateSettings. Standardmäßig ist dies folgender Unterstrich Konventionen:
```
templateSettings: {
    translate: /<%_([\s\S]+?)%>/g,
    i18nVarLeftDel: '<%=',
    i18nVarRightDel: '%>'
}
```
so, <%_ i18n %> gesetzt, um zu Kennzeichnen, übersetzbaren strings und <%= var %> wird verwendet, um zu bezeichnen Variablen innerhalb einer Vorlage.

Können Sie die übersetzung einer Vorlage durch den Aufruf under18n.templatezum Beispiel mit Unterstrich, die Sie tun können,
```
var templ = _.template(under18n.template(myTemplate, t));
```
Beispiel

Angesichts der folgenden Katalogen, die Fabriken und die Vorlage für die englische und Griechische und vorausgesetzt, Unterstrich Vorlage,
```
var test_en = {
        'files_label': 'Files',
        'num_files': 'There are ${num} files in this folder'
    },

    templ = '<h1><%= title %></h1>' +
            '<label><%_ files_label %></label>' +
            '<span><%_ num_files %></span>',

    t_en = underi18n.MessageFactory(test_en);
    t_el = underi18n.MessageFactory(test_el);
```
kann die Vorlage von gebaut,
```
var toRender = _.template(underi18n.template(templ, t_en));
toRender({title: 'Summary', num: 3});
```
ergeben würde
```
<h1>Summary</h1>
<label>Files</label>
<span>There are 3 files in this folder</span>
```
AMD be -

under18n sich als eine anonyme Modul, wenn Sie requireJS.

Ich hoffe das löst dein problem, lass mich wissen, wenn nicht, ich hatte geplant, es zu veröffentlichen irgendwann, aber hey, besser jetzt als nie 😉

InformationsquelleAutor der Antwort ggozad
9

Vollständigkeit halber, die Lösung, die uns eingefallen ist, dass gefühlt die meisten optimiert wurde:
1. Wenn ein template angefordert wurde vom server ein cookie bestimmt die Sprache und die richtige Vorlage geliefert wurde.
2. Verwendeten PHP-back-end pre-Parsen der templates; diese wurden dann in memcached gespeichert in der richtigen Sprache
3. Die Sprache, die Vorlage, einmal beantragt, wurde dann vom browser zwischengespeichert und intern in eine Rückgrat-Modell, so könnte es schnell wieder verwendet JavaScript.
Gründe:
- schneller JS (weit weniger regulären Ausdruck ersetzt). Wir haben nie gemessen, aber es ist nur logisch, wenn Sie entfernen die Funktionen vollständig.
- gespeichert, die übertragung einer GROßEN Sprache-Datei an den client
InformationsquelleAutor der Antwort Robbie

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.

Kataloge

Nutzung

Vorlagen

Beispiel

AMD be -