17

TwitterはのMustache.jsを使って、そのテンプレートにi18nを提供していますか?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!" 

は、しかし、私は、単数、複数などの例を条件文を提供するために、_(テキスト)関数とtranslationTableを構造化する方法についていくつかのより多くの洞察が欲しいですより高度なユースケースを解決することは非常に高く評価されます。

+1

Iは、Twitterは[hogan.js(http://twitter.github.com/hogan.js/)を使用するという印象の下にあったため口ひげのテンプレート。そうであれば、下のマーティンの答えは良い提案のようです。 –

答えて

5

条件付き、ループなどのより高度なケースの構造化は、通常のMustacheライブラリとまったく同じ方法で行われます。新しいI18N {{_i}}開始タグと{{/ 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/を参照してください。

6

あなたの質問には本当に答えるつもりはありませんが、このプロジェクトに多くの時間を費やすことを計画していない限り、私は真剣にこれをデータ問題として残すことを検討します。

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

そして:

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

それからちょうどテンプレートは、汎用ます

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

そして:1マッピング:

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

あなたが維持するために必要なのは1ですテンプレートとデータの間に

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

:)

0

私は何がやりたいことは口ひげと国際化機能を使用することであると信じてそれをシンプルに保ちます。これは以下のように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)); 
関連する問題