Node.js 使用 Mustache.js 做模板

红薯 发布于 2011/06/14 10:52
阅读 6K+
收藏 11

为了让 Node.js 输出更多的 HTML 元素,我们可以借助一些 html 模板引擎,例如 Mustache。

首先在 Node.js 中安装 Mustache:

npm install mustache

这会创建一个目录:node_modules\mustache

然后我们可以编写代码:

    var mustache = require('./node_modules/mustache/mustache');
     
    function helloworld(response)
    {
      console.log('request recieved at ' + (new Date()).getTime());
      response.writeHead(200, {'Content-Type': 'text/html'});
      var template = '<h1>Test</h1><p>{{helloworld}}</p>';
      var model = {helloworld:'Hello World'};
      response.end(mustache.to_html(template,model));
    }
     
    exports.helloworld = helloworld;

这段代码使用 to_html 函数生成网页,来看看执行效果:

但这看起来很不爽,我们希望模板独立于控制器之外,例如下面的模板:

    <html>
      <head>
        <title>My first template</title>
      </head>
      <body>
        <h1>Test</h1>
        <p>{{helloworld}}</p>
      </body>
    </html>

文件名是 helloworld.html.

为了使用这个模板文件,我们可以这样编写代码:

    var mustache = require('./node_modules/mustache/mustache');
    var fs = require('fs');
     
    function helloworld(response)
    {
      console.log('request recieved at ' + (new Date()).getTime());
      fs.readFile("./helloworld.html",function(err,template) {
                response.writeHead(200, {'Content-Type': 'text/html'})
                response.write(mustache.to_html(template.toString(), {helloworld:"Hello World"}))
                response.end()
         });
    }
     
    exports.helloworld = helloworld;

运行结果如下:

怎样,简单很多吧?:)

加载中
0
libo217005
libo217005
呵呵 nodejs的追随者已经直线彪升了.
0
漫步四海

一直在关注,还没有真正的自己动手做过!看来要着手开始做了,不然就要落伍了!楼主的文章拓展了我对nodejs的更深入的认识,谢了!

0
iwillwen
iwillwen
其实最好还是想前端发送JSON,然后前端用Mustache.js进行Render,这样才充分发挥Node.js在JavaScript MVC中的强大驱动力。
Wen_小问
Wen_小问
@笃行 : Mustache是跨语言跨平台的
g8up
g8up
Mustache.js是在服务器端运行吧?
0
yak
yak
Mustache 只能显示,不能再进一步做处理,比如我的数据是 1,0  想在页面上显示 有,无,只用模板是没法实现的
0
g8up
g8up

引用来自“libo217005”的答案

呵呵 nodejs的追随者已经直线彪升了.
Node.js交流QQ群:211566022

Need Tencent IM software support .
0
Z.han
Z.han
有时间把我的dotpl-js(精简的模板引擎)也整成Node Module。
0
matth
matth

这样是在服务器端已经生成了和html内容.而我之前的认识还是在浏览器端获取json等格式数据后再调用mustache.to_html()方法来生成html.不同的思路,学习了!    

 

0
郭振华oo
郭振华oo

引用来自“yak”的答案

Mustache 只能显示,不能再进一步做处理,比如我的数据是 1,0  想在页面上显示 有,无,只用模板是没法实现的
mustache是可以做判断输出的,具体和常用的模版引擎差不多...
返回顶部
顶部