29

MVCフレームワークでは、ビューを常に個別のファイルとして保存して取得できます。これはEmber.jsでどのように達成されると思われますか？私は何時間も探していたので、これをある種の重複として投票したい場合は、少なくとも決定的で直接的な答えを提供する質問またはリソースにリンクしてください。

たとえば、Emberは自動的にインデックスコントローラーを作成し、URLがである限りindexを指定するとテンプレートを自動的にレンダリングするため、この機能のためにapp.js以外のコードは必要ありません。index.handlebarsなどの別のファイルを作成し、Emberにそれを見つけてレンダリングさせるにはどうすればよいですか？{{outlet}}/window.App = Ember.Application.create();

4

6 に答える 6

17

テンプレートをプリロードするために、アプリケーションで次のコードを使用しました。jQueryを使用してテンプレートをファイルに追加してから、アプリケーションを起動します。コードは微調整を使用することができますが、それは私のために働いています...

var loaderObj = {

    templates : [
    '_personMenu.html',
    'application.html',
    'index.html',
    'people.html',
    'person.html',
    'people/index.html',
    'friend.html'
]
};

loadTemplates(loaderObj.templates);
//This function loads all templates into the view
function loadTemplates(templates) {
    $(templates).each(function() {
        var tempObj = $('<script>');
        tempObj.attr('type', 'text/x-handlebars');
        var dataTemplateName = this.substring(0, this.indexOf('.'));
        tempObj.attr('data-template-name', dataTemplateName);
        $.ajax({
            async: false,
            type: 'GET',
            url: 'js/views/' + this,
            success: function(resp) {
                tempObj.html(resp);
                $('body').append(tempObj);                
            }
        });
    });

}

var App = Ember.Application.create();
//Rest of the code here...
于 2013-03-24T01:39:31.450 に答える
7

を使用JQuery.ajaxしてテキストファイルをロードし、そこEmber.Handlebars.compileからテンプレートを作成できます。

$.ajax({
   url: 'http://example.com/path/to/your/file',
   dataType: 'text',
   success: function (resp) {
       MyApp.MyView = Ember.View.extend({
           template: Ember.Handlebars.compile(resp),
       });
   }
});
于 2013-02-09T11:03:12.470 に答える
3

JSを複数のファイルに分割し、ビルドプロセスを使用してそれらをつなぎ合わせるのは間違いなく標準です。サーバーサイドテクノロジーの選択に基づいてアプリケーションをレイアウトするための2つの異なる手法へのリンクを含む、別のSO質問に対するこの回答をご覧ください。

EmberJS：かなり複雑なアプリケーションでのモデル、ストア、コントローラー、ビューの関心の分離は適切ですか？

于 2013-04-17T06:34:38.920 に答える
3

少し遅れますが、ここで道を見つけた人のために、これをここに追加します。

ハンドルバーテンプレートのプリコンパイルはおそらくあなたが探しているものです。通常<script type="text/x-handlebars">、メインのアプリファイルにタグを追加することになりますが、ハンドルバーを使用してタグをJavascript文字列に置き換えて、に保存することもできますEmber.TEMPLATES。

コードがよりクリーンになるなど、これにはいくつかの利点がありますが、ランタイムバージョンのハンドルバーを使用できるため、必要なランタイムライブラリが小さくなり、ブラウザでテンプレートをコンパイルする必要がなくなります。

詳細については、http ：//handlebarsjs.com/precompilation.htmlおよびhttp://www.smashingmagazine.com/2013/11/07/an-in-depth-introduction-to-ember-js/#what_is_handlebars_template_precompilingを確認してください。

于 2014-08-25T11:00:30.950 に答える
0

これに対する私の解決策は、インクルード機能を備えたJade（nodejsでemberを使用しているため）のようなサーバー側のコンパイル言語を使用することです。各ハンドルバーテンプレートを個別のファイルとして記述し、コンパイル時に含めることができます。関連するジェイドドキュメント：https ：//github.com/visionmedia/jade#a13

または、Require.jsを使用して他のjsファイルを含めることができます。関連する質問があります。

于 2013-02-07T05:58:01.890 に答える
0

私はあなたの質問を理解しているのかわかりませんが、あなたがあなたが尋ねていると思うものを尋ねているなら、あなたはあなたの.handlebarsドキュメントをdata-template-nameタグに入れますscript：<script ... data-template-name="index">...</script>

于 2013-02-07T13:23:45.307 に答える