3

Backbone Layout Manager でハンドルバー テンプレートを動的にロードするために、RequireJS とテキスト プラグインを使用しています。ただし、ページの読み込み時に、指定されたテンプレートではなく、すべてのテンプレートがダウンロードされます。以下に示すケースでは、フッターをレンダリングしたいだけで、すべてのファイル ( headermodal) だけではなくフェッチされますfooter.tpl

templateLoader.js

define(function (require) {
    var Handlebars = require('handlebars');

    var getTemplateFile = function (templateName) {
        var tmpl = null;
        switch (templateName) {

        case 'header':
            tmpl = require('text!../html/templates/header.tpl');
            break;
        case 'footer':
            tmpl = require('text!../html/templates/footer.tpl');
            break;
        case 'modal':
            tmpl = require('text!../html/templates/modal.tpl');
            break;
        }
        return tmpl;
    };


    var _compiled = function (tpl, context) {
        var compiled = Handlebars.compile(tpl);
        return context ? compiled(context) : compiled;
    };

    return {
        getTemplate: function (templateName, model) {
            return _compiled(getTemplateFile(templateName), model);
        }
    }
});

MyView.js-レイアウトマネージャー

App.Views.StoreFooter = Backbone.Layout.extend({
    beforeRender: function () {
        this.$el.html(Templates.getTemplate('footer'));
    }
});

Chrome にダウンロードされたリソースを確認するとmodal.tplheader.tpl上記のコードによれば存在しないはずの が表示されます。

4

1 に答える 1