1

アプリケーションで基本的な i18n を実行したい

i18n プラグイン (require.js から) をアプリケーションにロードし、nlsいくつかのファイルを含むディレクトリを作成しました。project.js

main.js次のようなファイルにデフォルトの場所を設定しました

config : {
    i18n : {
        locale : 'de-de'
    }
}

ビュー/テンプレートでファイルを使用したいと考えています。誰かがこれがどのように行われるか説明できますか? テンプレートは、1 つの template.js ファイルでセットアップされます

私の見解：

define(['marionette', 'templates', 'i18n!nls/project'], function (marionette, templates, msg) {

    return marionette.CompositeView.extend({
        template : templates.project
    });

});

私のテンプレート:

<div class="container">
    <div class="well">
        <h2>Projects</h2>
    </div>
</div>

ビュー/テンプレートでファイルを使用する方法を誰かに説明してもらえますか? 前もって感謝します！

編集：

私はいくつかの試行錯誤によって解決策を見つけました。私はrequire.js tplを介してテンプレートをロードしています! プラグインで呼び出す場合、コンパイルする必要はありませんrequire('tpl!templates/dashboard.tmpl')。によってロードされた i18n ファイルを渡すだけです'i18n!nls/dashboard'。マリオネットでは、ビューはデフォルトでレンダリングされるため、次のようにしました。

define(['marionette', 'templates', 'i18n!nls/dashboard'], function (Marionette, templates, msg) {

    return Marionette.CompositeView.extend({

        template : function () {
            return templates.dashboard(msg);
        },

        initialize : function() {

        }
    });

});

i18n プラグインのファイルについては、こちらで詳しく説明されています: http://requirejs.org/docs/api.html#i18n

私はこれを段階的に行う必要がありました。最初にルートを見逃していました。次に、なぜドイツ語のロケールがロードされなかったのか疑問に思いましたが、単にde-de : trueルート ファイルに設定するのを忘れていました。今、すべてが魔法のように機能しています

4

1 に答える 1

5

最初に、require.js を介して i18 ファイルをビューにロードします。この例では、ハンドルバー テンプレートを使用します。

define([
    'marionette',
    'handlebars',
    'text!modules/tableModule/templates/myTmpl.html',
    'i18n!nls/dashboard',
],
function(Marionette, Handlebars, tmpl, locals) { ...

次に、i18 オブジェクトを使用してテンプレートをコンパイルおよびロードします。

var template = Handlebars.compile(tmpl);
this.template = template(locals.myVar);

複雑な組み合わせもできます

  var template = Handlebars.compile(tmpl);  
  var data =_.extend(options, {lang:locals});
  this.template = template(data);

あなたのnlsファイルは次のようになります

define({

    "root": {
         "myVar" : "some text in",
         "canBeAnObjectTo": {
                      "title"   : "my title ",
                      "contact" : "Contact",
            }

ビューは次のようになります。

  <div class="cssClass">
<div class="table-caption pull-left">{{this.myVar}}</div>
  </div>

それが役立つことを願っています

于 2013-02-11T07:40:00.033 に答える