Jak zrobić i18n z kierownicą.js (szablony wąsów)?

Obecnie używam kierownicy.js (związany z Backbone i jQuery), aby aplikacja webowa prawie całkowicie renderowana po stronie klienta, a ja mam problemy z internacjonalizacją tej aplikacji.

Jak to zrobić?

Czy są jakieś pluginy?

Author: Simon Adcock, 2011-10-14
Source

6 answers

Wiem, że już na to odpowiedziałam, ale chciałbym podzielić się moim prostym rozwiązaniem. W oparciu o rozwiązanie Gazlera wykorzystujące I18n.js (którego używamy w naszym projekcie w pracy), po prostu użyłem bardzo prostego pomocnika kierownicy, aby ułatwić proces lokalizacji w locie: {]}

Handler 

Handlebars.registerHelper('I18n',
  function(str){
    return (I18n != undefined ? I18n.t(str) : str);
  }
);

Szablon 

<script id="my_template" type="x-handlebars-template">
    <div>{{I18n myVar}}</div>
</script>

Główną zaletą tego jest to, że nie ma kosztownego przetwarzania przed/po całym obiekcie json. Nie wspominając o tym, czy przychodzący json jeśli zagnieżdżone obiekty / tablice, czas spędzony na ich szukaniu i analizowaniu może być kosztowny, jeśli obiekt jest ogromny.

Zdrówko!
 79
Author: poweratom,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-01-10 04:24:05

Https://github.com/fnando/i18n-js jest klejnotem ruby, który utworzy plik internacjonalizacji z folderu config / locales. Jednak jeśli nie używasz rails, możesz znaleźć javascript używany samodzielnie TUTAJ.

Następnie po prostu przechowujesz tłumaczenia w zagnieżdżonym obiekcie..

I18n.translations = {"en":{"date":{"formats":{"default":"%Y-%m-%d","short":"%b %d","long":"%B %d, %Y"}}}};

Coś, co może być również przydatne dla ciebie, że używam w moich projektach jest łatka do wąsów, która automatycznie tłumaczy ciągi w formacie @@ translation_key @ @ 

i18nize = function (result) {
    if (I18n) {
      var toBeTranslated = result.match(/@@([^@]*)@@/gm);
      if (!toBeTranslated) return result;
      for(var i = 0; i < toBeTranslated.length; i++) {
        result = result.replace(toBeTranslated[i], I18n.t(toBeTranslated[i].replace(/@/g, "")));
      }
    }
    return result;
};

Następnie wywołujesz i18nize po render, aby umożliwić umieszczanie tłumaczeń w szablonach zamiast ich przekazywania.

Uważaj na łatanie wąsów, ponieważ nie będziesz w stanie przenieść szablonów do standardowych implementacji wąsów. jednak w moim przypadku oferowane korzyści przeważyły nad tym problemem.

Mam nadzieję, że to pomoże.
 4
Author: Gazler,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-11-11 10:32:41

Na podstawie odpowiedzi @poweratom:

Tylko z ember.js , to samo z opcjami przekazanymi do I18n.js.

Magicznie przeładuje się, jeśli zostaną użyte właściwości obliczeniowe.

Ember.Handlebars.helper "t", (str, options) ->
  if I18n? then I18n.t(str, options.hash) else str

Szablon: 

{{t 'sharings.index.title' count=length}}

Yml: 

en:
  sharings:
    index:
      title: To listen (%{count})
 3
Author: jvenezia,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-02-09 18:56:11

Z NodeJs / Express :

  • Node-i18n (detect the Accept-Language header) 

      app.use(i18n.init);

  • Przykładowy plik tłumaczenia 

    {   
 "hello": "hello",   
 "home-page": {
   "home": "Home",
    "signup": "Sign Up"  
 } 
}

  • In Express controller 

    ...
data.tr = req.__('home-page');
var template = Handlebars.compile(source);
var result = template(data);

  • Szablon Kierownicy 

        <li class="active"><a href="/">{{tr.home}}</a></li>
 1
Author: dam1,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-04-09 14:08:34

Dla tych, którzy nie używają żadnego frameworka JS http://i18next.com wygląda obiecująco

Wystarczy utworzyć handlebars helper aby wywołać tłumaczenia jak tutaj http://i18next.com/pages/doc_templates.html

 0
Author: equivalent8,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-02-23 16:48:05

Na pytanie udzielono odpowiedzi, ale może to być przypadek, w którym nie chcesz polegać na żadnej lib i8n i używać całkowicie własnej. Używam własnych inspiracji z https://gist.github.com/tracend/3261055

 0
Author: Sahib Khan,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-10-26 15:41:40