Nodejs Backbone模板

时间:2013-05-16 07:35:20

标签: node.js backbone.js pug hamlc

我已经使用rails,requirejs和backbone做了很多工作,并且知道如何在rails中使用haml咖啡模板。

App = new Backbone.Marionette.Application()



App.addInitializer (options) ->
  Backbone.history.start()
  alert "yay"


$ ->
 alert "yay"
 App.start() 

我如何在Node.js中做到这一点,我有一个Node.js应用程序,我在一个关于如何获得模板来编译客户端的deadend,我不会被困在haml咖啡,任何模板引擎会做,玉也很好,也是强调。这是一个很好的起点,以便我可以继续在node.js中构建主干应用程序。

感谢任何帮助!

2 个答案:

答案 0 :(得分:1)

我不建议将模板拖到客户端并在那里编译它们,正确的方法是使用一些框架,例如www.socketstream.com,提供你想要的东西等等。如果您反对框架快速而肮脏的解决方案,在服务器上编译它们并在客户端上将它们作为函数调用将是:

// compile.js 
var fs = require("fs")
    ,jade = require("jade");

exports.build = function(templatesDir) {
    var js = "var Templates = {}; \n\n";
    var files = fs.readdirSync(templatesDir);
    var jadeFiles = files.filter(function(file) {
        return file.substr(-5) === ".jade";
    });
    for(var i = 0; i < jadeFiles.length; ++i){
    var filePath, key;
    var file =  jadeFiles[i];
    key = file.substr(0, file.indexOf("."));
    filePath = templatesDir + file;
    var jadeSource =  fs.readFileSync(filePath);
    js += "Templates." + key + " = " + jade.compile(jadeSource, {
        debug: false,
        client: true
    }).toString() + "; \n\n";
}
return js;

};

// On the server.js
// Compile views
var viewsPath = path.join(__dirname, 'views/');
var generatedJs =  require('./compile').build(viewsPath);
var savePath = path.join(__dirname, 'public/js/lib/templates.js');
fs.writeFile(savePath, generatedJs, function (err) {
    if (err) throw err;
});

// Then on the client include js/lib/templates.js and use templates like this
FactSummaryView = Backbone.View.extend({
        template: Templates.issueSummary,
        render: function() {
            this.$el.html(this.template(this.model.toJSON()));

        return this;
    }
});

// Also add templates.js to nodemonignore if you're using nodemon
./public/js/lib/templates.js
/public/js/lib/templates.js

答案 1 :(得分:0)

您通常不会在客户端上编译模板(期望模板直接在浏览器中编辑),而是在后端编译并且呈现在浏览器中。

编译模板

在此步骤中,您将模板源代码编译为包含渲染功能的JavaScript文件。

您可以使用haml-coffee on the command line并在构建过程中制作脚本,也可以使用Haml-Coffee自述文件的integration部分中列出的项目。

Grunt是运行某些任务的常用解决方案,使用Grunt-Haml,您确实可以为项目提供灵活的构建解决方案。

渲染模板

要使用Marionette渲染模板,您需要确保客户端上的模板渲染功能可用。只需将配置的命名空间键入开发人员工具,即可查看模板功能是否已注册:

Registered template functions

如果没问题,您需要有一个自定义模板渲染功能:

Backbone.Marionette.Renderer.render = (template, data) ->
  if JST[template]
    JST[template](data)
  else if _.isFunction(template)
    template(data)
  else
    console.error 'Template %s not found', template

现在您只需定义视图模板即可正确呈现:

class App.Views.Login extends Backbone.Marionette.ItemView
  template: 'shared/_login'