部分在Express.js和Mustache中呈现

时间:2012-05-09 21:55:18

标签: express mustache

我正在尝试在express.js中加载一个Mustache部分,但显然我遇到了一些麻烦。是否可以采用这样的EJS方法,其中包含视图部分文件:

Node.js - EJS - including a partial

我有一个名为 index.html

的模板文件
<html>
    <head>
        <title>My Title</title>
    </head>
    <body>
        {{>header}}
    </body>
</html>

header.mustache

<div class="header">
    <div style="display: table-cell;padding-left: 10px;padding-top: 8px;vertical-align: middle;">
        <img src="images/logo.png">
    </div>
</div>

在express.js中,我的渲染函数是这样的:

app.get('/', function(req, res) {
    res.render('signup.html', {
        partials: {
            header: partial('header.mustache')   //this line is wrong        
        }
    });
});

我是这方面的新手,但想以某种方式呈现或读取header.mustache的全部内容到header对象。这可能吗?

1 个答案:

答案 0 :(得分:1)

看看以下链接,它可以解释如何使用express.js

设置小胡子

Using Mustache Templates in Express

现在,为了能够从外部文件加载部分,请将tmpl.compile修改为以下

compile : function(source, options) {
    var views = options.views || './views';
    var extension = options.extension || '.html';

    if (typeof source == 'string') {
        return function(options) {
            options.locals = options.locals || {};
            options.partials = options.partials || {};

            if (options.body) // for express.js > v1.0
                locals.body = options.body;

            for(var p in options.partials) {
                var partialFileName = views + '/' + options.partials[p] + extension;

                if(path.existsSync(partialFileName)) {
                    options.partials[p] = fs.readFileSync(partialFileName, "utf-8");
                }
            }               
            return mustache.to_html(source, options.locals, options.partials);
        };
    } else {
        return source;
    }
}

您还需要添加以下2个必需语句

var fs = require("fs"),
var path = require("path");

此更改假定您的部分位于views目录中,并以扩展名.html结束(因此,您可能希望将部分扩展名更改为.html或相应地调整上述代码)

现在您可以使用以下部分渲染

app.get('/', function(req, res) {
    res.render('signup.html', {
        partials: {
            header: 'header'   //this now works :)
        }
    });
});