Node.js + Express + Handlebars.js +局部视图

Question

我想用Node.js | Express使用Handlebars.js作为服务器模板引擎来制作一个简单的HelloWorld项目。

问题是，我找不到任何使用这样的链的例子，特别是与多视图。

比如我想定义标题视图：

<header> 
    <span>Hello: {{username}}</span> 
</header> 

，并与其他意见每一页都用它。

也许我正在以一种错误的方式思考这个观点，我认为这种观点是一种控制，我可以在任何其他视图内的任何页面上重复使用。

我欣赏任何指向我可以学习的教程或（更好）开源项目的链接。

Answer 1

我目前使用ericf的实施“车把快车”，并发现它是优秀的：

https://github.com/ericf/express3-handlebars

需要记住的重要一点是，在快递，如内反对浏览器，在视图渲染阶段，handlebars被激活。客户端代码最终只会成为纯HTML，就像在PHP上下文中使用胡子一样。

Answer 2

您需要使用偏分量。

查看https://github.com/donpark/hbs/tree/master/examples/partial了解使用偏分量的一个很好的例子。

再举一例http://blog.teamtreehouse.com/handlebars-js-part-2-partials-and-helpers

Answer 3

使用https://www.npmjs.org/package/hbs | https://github.com/donpark/hbs

让我们假设你有：

+ views 
    - index.hbs 
    + partials 
    - footer.hbs 

您需要注册该文件夹中包含您的谐音：

hbs.registerPartials(__dirname + '/views/partials'); 

谐音将有该文件具有的确切名称。您也可以通过注册您的谐音具体名称：

hbs.registerPartial('myFooter', fs.readFileSync(__dirname + '/views/partials/footer.hbs', 'utf8')); 

那么你访问它是这样的：

这里

完整的示例：https://github.com/donpark/hbs/tree/master/examples/partial

Answer 4

我知道这已经被问了一个很长前一段时间，但没有人在这篇文章中显示出答案。所以我会在这里做。为了确保每个人都在同一页面上，我会在我的答案中详细说明。如果看起来过于简单，我会提前道歉。

在您的server.js文件（或app.js，无论您将handlebars定义为视图引擎的位置）中。根据您使用的npm包，如hbs或express-handlebars等，它可能看起来不同，但与此类似。注意：在这个例子中我使用了express-handlebars。

file：server。JS

... 
var express  = require('express'), 
    hbs   = require('express-handlebars'), 
    app   = express(); 
... 

app.engine('hbs', hbs({ 
    extname: 'hbs', 
    defaultLayout: 'main', 
    layoutsDir: __dirname + '/views/layouts/', 
    partialsDir: __dirname + '/views/partials/' 
})); 

app.set('view engine', 'hbs'); 

... 

和文件结构应该是这个样子：

| /views/ 
|--- /layouts/ 
|----- main.hbs 
|--- /partials/ 
|----- header.hbs 
|----- footer.hbs 
|----- ... etc. 
|--- index.hbs 
| server.js 

和你main.hbs文件应该是这样的：

文件：main.hbs

... 
{{> header }} 
... 
<span> various other stuff </span> 
... 
{{> footer }} 

为了表示部分你使用此语法：{{> partialsNames }}。