Как сделать расширенный i18n с Mustache.js? - PullRequest
Новая
       20

Как сделать расширенный i18n с Mustache.js?

18 голосов
/ 08 ноября 2011

Похоже, что Twitter использует fork из Mustache.js для предоставления i18n своим шаблонам?

Может кто-нибудь привести краткий пример того, как это делаетсяи, возможно, также опишите, какая семантика необходима для краудсорсинга этих переводов?

Конечно, есть такой простой пример: 

var template = "{{_i}}{{name}} is using mustache.js!{{/i}}"

var view = {
  name: "Matt"
};

var translationTable = {
  // Welsh, according to Google Translate
  "{{name}} is using mustache.js!": "Mae {{name}} yn defnyddio mustache.js!"
};

function _(text) {
  return translationTable[text] || text;
}

alert(Mustache.to_html(template, view));
// alerts "Mae Matt yn defnyddio mustache.js!"

Но я хотел бы получить больше понимания о том, как структурировать _(текст), функция и перевод. Таблица для предоставления условных выражений, единственного, множественного числа и т. д. Примеры решения более сложных вариантов использования будут высоко оценены.

Ответы [ 3 ]

7 голосов
/ 07 марта 2012

Я знаю, что на самом деле я не отвечаю на ваш вопрос, но если вы не планируете тратить много времени на этот проект, я бы серьезно подумал просто оставить это как проблему с данными. 

{
    title : {
        key: 'título',
        value: 'bienvenida'
    }
}

И: 

{
    title : {
        key: 'لقب',
        value: 'ترحيب'
    }
}

Затем просто сделайте шаблон общим: 

<h1>{{title.key}}: {{title.value}}</h1>

И: 

<h1>{{title.value}} {{title.key}}</h1>

Все, что вам нужно для поддержки, - это отображение 1: 1 между шаблонамии данные.

Mustache.render(data[language], template[language]);

Не усложняйте:)

5 голосов
/ 27 декабря 2011

Структурирование более сложных случаев, включая условия, циклы и т. Д., Выполняется точно так же, как и в обычной библиотеке Усов.Вы можете использовать новые начальный и конечный теги I18N {{_i}} для обертывания частей вашего шаблона в целях перевода.

Если ваш шаблон: 

<h1>Title: {{title}}</h1>
<ul>
   {{#a_list}}
      <li>{{label}}</li>
   {{/a_list}}
</ul>

, вы можете просто обернуть первую строку 

<h1>{{_i}}Title: {{title}}{{/i}}</h1>

и включить внутреннюю часть в карту перевода.

См. http://jsfiddle.net/ZsqYG/2/ для полного примера.

0 голосов
/ 02 января 2013

Я считаю, что вы хотите использовать функции i18n с усами. Это может быть достигнуто путем перегрузки метода Mustache.render следующим образом: 

var lang = {
    'is_using_pre': 'Mae ',
    'is_using': 'yn defnyddio'
};

var Mustache = (function (Mustache) {
    var _render = Mustache.render;

    Mustache.render = function (template, view, partials) {
        view['lang'] = lang;
        return _render (template, view, partials);
    };

    return Mustache;
}(Mustache));

var template = "{{_i}}{{lang.is_using_pre}}{{name}} {{lang.is_using}} mustache.js!{{/i}}";
var view = {
  name: "Matt"
};

alert(Mustache.to_html(template, view));
...