Backbone.js从html文件中分离模板

我正在使用Backbone.js应用程序。我们使用underscore.js模板将内容加载到视图中。目前我们在index.html文件中有所有的模板，所以文件的大小正在增加。任何人都可以帮助我找到解决方案将这些模板分隔到其他文件？提前致谢。Backbone.js从html文件中分离模板

编辑

最近我走访了Backbone patterns，我发现，我们可以使用JST templates创建单独的模板文件为每个模板。他们解释说，我们可以创建一个jst.js文件把我们所有的模板代码：

// http://myapp.com/javascripts/jst.js 
window.JST = {}; 

window.JST['person/contact'] = _.template(
    "<div class='contact'><%= name %> ..." 
); 

window.JST['person/edit'] = _.template(
    "<form method='post'><input type..." 
); 

<script src="http://myapp.com/javascripts/jst.js"></script>

现在所有的模板都在jst.js文件。但是，如果你有很多的模板和要移动模板到单独的文件，你可以创建单独的模板文件：

// http://myapp.com/javascripts/jst.js 
window.JST = {}; 

//http://myapp.com/javascripts/contactPerson.template.js 
window.JST['person/contact'] = _.template(
    "<div class='contact'><%= name %> ..." 
); 

//http://myapp.com/javascripts/editPerson.template.js 
window.JST['person/edit'] = _.template(
    "<form method='post'><input type..." 
); 

<script src="http://myapp.com/javascripts/jst.js"></script> 
<script src="http://myapp.com/javascripts/contactPerson.js"></script> 
<script src="http://myapp.com/javascripts/editPerson.js"></script>

请让我知道是否有任何简单的想法。谢谢！

来源

2012-04-05 abhidsm

看着你的模板分离成文件，然后在部署之前将它们编译成js文件。请参阅http://documentcloud.github.com/jammit/#jst这样的资产打包商 – 2012-04-05 21:26:21

您可以在单独的HTML文件的模板，并可以使用requirejs加载它们为文本。有一个名为text的插件可以帮助你做到这一点。

例子：

define([ 
    'text!templates/sampleTemplate.html' 
], function(tmpl){ 

    var Sampleview = Backbone.View.extend({ 
     id: 'sample-page', 

     template: _.template(tmpl), 

     render: function() { 
     $(this.el).html(this.template()); 
     return this; 
    } 
    }); 
    return SampleView; 
});

HTML文件“模板/ sampleTemplate.html”将被从require.js配置指定的根路径采取

来源

2013-06-11 11:23:02 Tamillharasan

通过xhr加载它们。 lib requirejs（requirejs.org）以这种方式加载html文件依赖关系。这将在开发时工作，但模板应该被编译到生产中的js文件中。

来源

2012-04-06 00:25:29 Trevor

Backbone.js从html文件中分离模板

回答

相关问题