Jak wykonać zaawansowany i18n z Mustache.js?

Question

Wygląda na to, że Twitter używa fork z Mustache.js, aby zapewnić i18n swoim szablonom?

Czy ktoś mógłby podać krótki przykład tego, jak to się robi, a może także nakreślić, co semantyka jest niezbędna do tłumienia tych tłumaczeń?

Istnieje oczywiście ten prosty przykład:

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

Ale chciałbym trochę więcej wgląd w jaki sposób uporządkowanie _ function (tekst) i translationTable świadczenia warunkowe, w liczbie pojedynczej, mnogiej itp przykłady rozwiązywanie bardziej zaawansowanych przypadków użycia byłoby bardzo docenione.

Answer 1

Strukturyzowanie bardziej zaawansowanych przypadków, w tym warunków, pętli itp., Odbywa się w taki sam sposób, jak w przypadku zwykłej biblioteki wąsów. Możesz użyć nowych tagów końcowych I18N {{_i}} start i {{/ i}}, aby zawijać części szablonu w celach tłumaczenia.

Jeśli szablon jest:

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

można po prostu zawinąć pierwszą linię

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

i obejmują część wewnętrzną na mapie tłumaczenia.

Aby uzyskać pełny przykład, zobacz stronę http://jsfiddle.net/ZsqYG/2/.

Answer 2

Wiem, że nie odpowiadam na twoje pytanie naprawdę, ale jeśli nie planujesz spędzać dużo czasu na tym projekcie, poważnie rozważałbym pozostawienie tego jako problemu z danymi.

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

I:

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

Następnie wystarczy zrobić szablon Generic:

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

oraz:

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

Wszystko, czego potrzebujesz, aby utrzymać to 1: 1 mapowanie między szablonami i danymi.

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

Keep it simple :)

Answer 3

wierzę, co chcesz zrobić, to skorzystać z funkcji i18n z wąsem. Można to osiągnąć przez przeciążenie metody Mustache.render następujące:

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));