如何获取在node / hapi.js中工作的handlebar-layouts [英] how to get handlebar-layouts working in node/hapi.js
问题描述
我无法在hapi.js应用程序中获取handlebars布局。布局渲染正常，但部分渲染完全不显示，只是空白。
我声明如下：
var handlebars = require（'handlebars'），
layouts = require（'handlebars-layouts'）;
布局（把手）;
server.views（{
engines：{
html：handlebars
}，
basePath：__dirname，
path：'./ views'，
layoutPath：'./views/layout'，
partialsPath：'./views/partials'，
layout：true，
helpersPath：'./views/助手'
}）;
和锅炉板布局
< HTML>
< body>
{{#contentbody}}
< h2>欢迎首页< / h2>
{{/ content}}
{{#contentfoot}}
{{/ content}}
< / body>
< / html>
和html部分
{{＃extendlayout}}
{{#contentbody}}
< h2>子页面内容< / h2>
{{/ content}}
{{#contentfootmode =prepend}}
< script src =assets / js / analytics.js >< /脚本>
{{content}}
{{/ extend}}
Hapi支持开箱即用的布局。问题在于你试图将hapi的布局支持与handlebars-layouts模块一起使用。这不会起作用。要么使用内置的布局支持，要么使用handlebars-layouts。此外，在布局中，您需要使用 {{＃blockbody}} {{block}} 来代替 {{＃content体}} 。以下是两个示例：
使用handlebars-layouts模块：
索引.js：
var Handlebars = require（'handlebars'）;
var HandlebarsLayouts = require（'handlebars-layouts'）;
var Hapi = require（'hapi'）;
var Path = require（'path'）;
var engine = Handlebars.create（）;
HandlebarsLayouts.register（引擎）;
var server = new Hapi.Server（）;
server.connection（{
host：'127.0.0.1'，
port：8000
}）;
$ b server.views（{
engines：{
html：engine
}，
path：Path.join（__ dirname，'views'），
partialsPath：Path.join（__ dirname，'views / partials）'
}）;
$ b server.route（{
method：'GET'，
path：'/ item'，
handler：function（request，reply）{
reply.view（'item'，{title：'Item Title'，body：'Item Body'}）;
}
}）;
server.start（）;
views / partials / page.html：
{{＃extendlayout}}
{{#contentbody}}
< h2> {{title}} < / H2>
{{/ content}}
{{#contentfootmode =prepend}}
< script src =assets / js / analytics.js >< /脚本>
{{/ content}}
{{/ extend}}
views / partials / layout.html：
< html>
< body>
{{#blockbody}}
< h2>欢迎首页< / h2>
{{/ block}}
{{#blockfoot}}
{{/ block}}
< / body>
< / html> b
$ b $ views $ $ p $ {{＃embedpage}} {{/ embed}}
{{body}}
pre>
使用hapi内置的布局支持：
index.js：
var Handlebars = require（'handlebars'）;
var Hapi = require（'hapi'）;
var Path = require（'path'）;
var server = new Hapi.Server（）;
server.connection（{
host：'127.0.0.1'，
port：8000
}）;
server.views（{
engines：{
html：Handlebars.create（）
}，
path：Path.join（__ dirname，' views'），
layoutPath：Path.join（__ dirname，'views / layout'），
layout：true，
partialsPath：Path.join（__ dirname，'views / partials'）
}）;
$ b server.route（{
method：'GET'，
path：'/ item'，
handler：function（request，reply）{
reply.view（'item'，{title：'Item Title'，body：'Item Body'}）;
}
}）;
server.start（）;
views / layout / layout.html：
< HTML>
< body>
{{> header}}
{{{content}}}
{{> footer}}
< / body>
< / html>
view / partials / footer.html：
< script src =assets / js / analytics.js>< / script>
views / partials / header.html：
< h2> {{@ root.title}} {{^ title}}欢迎回家{{/ title}}< / h2> b
$ b $ views $ $ p> {{body}}
I'm having trouble getting handlebars-layouts to render in a hapi.js app. The layout renders fine but the partial doesn't render at all and just has a blank.
I'm declaring it like this:
var handlebars = require('handlebars'),
layouts = require('handlebars-layouts');
layouts(handlebars);
server.views({
engines: {
html: handlebars
},
basePath: __dirname,
path: './views',
layoutPath: './views/layout',
partialsPath: './views/partials',
layout: true,
helpersPath: './views/helpers'
});
and the boiler plate layout
<html>
<body>
{{#content "body"}}
<h2>Welcome Home</h2>
{{/content}}
{{#content "foot"}}
{{/content}}
</body>
</html>
and html partial
{{#extend "layout"}}
{{#content "body"}}
<h2>Sub page content</h2>
{{/content}}
{{#content "foot" mode="prepend"}}
<script src="assets/js/analytics.js"></script>
{{/content}}
{{/extend}}
解决方案 Hapi supports layouts out of the box. The problem is that you are trying to use hapi's layout support together with the handlebars-layouts module. It's not going to work. Either use the built-in layout support, or use handlebars-layouts. Also, in the layout you need to use {{#block "body"}}{{/block}} instead of {{#content "body"}}. Here are two examples:
With the handlebars-layouts module:
index.js:
var Handlebars = require('handlebars');
var HandlebarsLayouts = require('handlebars-layouts');
var Hapi = require('hapi');
var Path = require('path');
var engine = Handlebars.create();
HandlebarsLayouts.register(engine);
var server = new Hapi.Server();
server.connection({
host: '127.0.0.1',
port: 8000
});
server.views({
engines: {
html: engine
},
path: Path.join(__dirname, 'views'),
partialsPath: Path.join(__dirname, 'views/partials)'
});
server.route({
method: 'GET',
path: '/item',
handler: function (request, reply) {
reply.view('item', { title: 'Item Title', body: 'Item Body' });
}
});
server.start();
views/partials/page.html:
{{#extend "layout"}}
{{#content "body"}}
<h2>{{title}}</h2>
{{/content}}
{{#content "foot" mode="prepend"}}
<script src="assets/js/analytics.js"></script>
{{/content}}
{{/extend}}
views/partials/layout.html:
<html>
<body>
{{#block "body"}}
<h2>Welcome Home</h2>
{{/block}}
{{#block "foot"}}
{{/block}}
</body>
</html>
views/item.html:
{{#embed "page"}}{{/embed}}
{{body}}
With hapi's built-in layout support:
index.js:
var Handlebars = require('handlebars');
var Hapi = require('hapi');
var Path = require('path');
var server = new Hapi.Server();
server.connection({
host: '127.0.0.1',
port: 8000
});
server.views({
engines: {
html: Handlebars.create()
},
path: Path.join(__dirname, 'views'),
layoutPath: Path.join(__dirname, 'views/layout'),
layout: true,
partialsPath: Path.join(__dirname, 'views/partials')
});
server.route({
method: 'GET',
path: '/item',
handler: function (request, reply) {
reply.view('item', { title: 'Item Title', body: 'Item Body' });
}
});
server.start();
views/layout/layout.html:
<html>
<body>
{{> header}}
{{{content}}}
{{> footer}}
</body>
</html>
view/partials/footer.html:
<script src="assets/js/analytics.js"></script>
views/partials/header.html:
<h2>{{@root.title}}{{^title}}Welcome Home{{/title}}</h2>
views/item.html:
{{body}}
这篇关于如何获取在node / hapi.js中工作的handlebar-layouts的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
