程序员经验分享-hwhale

如何让车把布局在 node/hapi.js 中工作

2024-04-02

我无法在 hapi.js 应用程序中渲染车把布局。布局渲染得很好，但部分根本不渲染，只有空白。

我这样声明：

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'
});

和锅炉板布局

<html>
  <body>
    {{#content "body"}}
        <h2>Welcome Home</h2>
    {{/content}}

    {{#content "foot"}}

    {{/content}}
 </body>
</html>

和 html 部分

{{#extend "layout"}}

    {{#content "body"}}
        <h2>Sub page content</h2>
    {{/content}}

    {{#content "foot" mode="prepend"}}
        <script src="assets/js/analytics.js"></script>
    {{/content}}
{{/extend}}

Hapi 支持开箱即用的布局。问题是您正在尝试将 hapi 的布局支持与handlebars-layouts 模块一起使用。这是行不通的。使用内置布局支持，或使用把手布局。另外，在布局中您需要使用{{#block "body"}}{{/block}}代替{{#content "body"}}。下面是两个例子：

使用车把布局模块：

索引.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();

视图/partials/page.html：

{{#extend "layout"}}

    {{#content "body"}}
        <h2>{{title}}</h2>
    {{/content}}

    {{#content "foot" mode="prepend"}}
        <script src="assets/js/analytics.js"></script>
    {{/content}}

{{/extend}}

视图/partials/layout.html：

<html>
  <body>
    {{#block "body"}}
        <h2>Welcome Home</h2>
    {{/block}}

    {{#block "foot"}}

    {{/block}}
 </body>
</html>

视图/item.html：

{{#embed "page"}}{{/embed}}

{{body}}

借助 hapi 的内置布局支持：

索引.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();

视图/布局/layout.html：

<html>
  <body>
    {{> header}}

    {{{content}}}

    {{> footer}}
 </body>
</html>

查看/partials/footer.html：

<script src="assets/js/analytics.js"></script>

视图/partials/header.html：

<h2>{{@root.title}}{{^title}}Welcome Home{{/title}}</h2>

视图/item.html：

{{body}}
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

handlebarsjs

hapijs

如何让车把布局在 node/hapi.js 中工作 的相关文章

  • 如何根据集合的大小创建有条件的模板？

    我想做这样的事情

  • 如何将主干视图连接到流星车把模板？

    看起来像 Backbone view meteor 和 handbars 在操作 DOM 的一部分时具有重叠功能 我查看了 ToDo 应用程序 它应该使用 Backbone 但实际上 他们只使用路由器 主干视图也处理模板 但它们听起来与流星

  • 如何从 Liquid 模板渲染 Handlebars 标记 (Jekyll)

    我在博客中使用 Jekyll 渲染 Handlebars 模板很痛苦 我们必须像这样逃脱 highlight html div code div endhighlight 太丑了 有没有更简单的方法来做到这一点 我找到了答案 highlig

  • 是否可以将 supertest 与 hapi 一起使用？

    我用的是hapi 不是express 超级测试还应该有效吗 如果是这样 有没有一种快速方法可以更改我的代码以使其运行 我的测试看起来像这样 基于文档 https github com visionmedia supertest import

  • Express & Handlebars 的全球属性

    我使用 Handlebars 使用express3 handlebars 作为模板 使用 Passport 在 NodeJS 应用程序中进行身份验证 一切都很好 但我想知道是否有一种方法可以将 Passport 创建的 req user 对

  • emberjs 文档就绪函数应该放在哪里？

    我正在尝试附加一个预先输入 https github com twitter typeahead js 到我的模板之一中的文本输入 因为 Ember 使用把手 所以 jQuery 的文档就绪函数不是用于预输入定义的地方 放置 模板就绪 代码

  • 使用 ember 评估车把中的两个条件

    我想知道是否可以做这样的事情 if ClientController Client number PhoneController hasLinesToInstall if Thanks Juanitos 我认为不可能在车把中链接这样的条件

  • 如何在 Meteor 模板中打印键和值？

    我有来自助手的 JSON Name abc Age 24 Address street xyz street city zyz city country XY 我想打印带有键和值的地址

  • 如何让车把布局在 node/hapi.js 中工作

    我无法在 hapi js 应用程序中渲染车把布局 布局渲染得很好 但部分根本不渲染 只有空白 我这样声明 var handlebars require handlebars layouts require handlebars layout

  • 异步加载车把模板

    我正在尝试编写一个函数 该函数将为我提供一个已编译的车把模板 我将所有模板都放在单独的文件中 使用 ajax 调用来获取模板并编译它以供使用 但我需要使用承诺 以便我可以实际使用它 function getTemplate name get

  • 是否可以在 Handlebars #if 中使用函数？

    我有一个控制器对象 如下所示 MyApp objController Ember ArrayController create init function data data isValid function return data val

  • 在车把模板中插入 html 而不转义

    有没有办法将带有 html 标签的字符串插入到车把模板中 而不会在输出字符串中转义标签 模板 js p content p 使用模板 HBS template content i test i 123 实际结果 p lt i gt test

  • 车把中的每一行都显示出奇怪的行为

    each orderData everyOther key 4 div class row everyOther div class col md 3 a class aremove href div class thumbnail img

  • 车把模板的文件扩展名

    我更改了车把模板的扩展名 并在调用 handlebarjs 编译函数的函数中引用了相同的扩展名 它工作得很好 没有任何问题 但我很好奇是否还有其他人尝试过 如果您认为这可能会因任何原因导致问题 请告诉我 出于某种原因 我觉得扩展名 hand

  • 错误“DocumentNotFoundError：找不到查询的文档”{_id：xxx}

    我克隆了对象 preventivo 当我运行此代码时 出现以下错误 节点 24548 UnhandledPromiseRejectionWarning 未处理的承诺拒绝 拒绝ID 1 DocumentNotFoundError 在模型 pr

  • 使用嵌套对象进行 Hapi/Joi 验证

    我对我的其中一条路线进行了以下验证 payload keywordGroups Joi array items Joi object keys language Joi string required containsAny Joi arr

  • 使用 Handlebars.js 迭代基本的“for”循环

    我是 Handlebars js 的新手 刚刚开始使用它 大多数示例都基于对象的迭代 我想知道如何在基本 for 循环中使用车把 Example for i 0 i lt 100 i create li s with i as the va

  • 如何在流星模板中设置日期格式

    我需要以 mm dd yyyy 格式显示数据库中的日期 因为它以 ISO 格式保存在mongodb如何在模板中转换它 这是我的代码 Template templatename vname function return Posts find

  • Ember：命名出口错误

    我不知道为什么我的模板没有在指定的插座中呈现 这是我第一次尝试学习 ember 我被困在指定的渠道上 我想渲染侧边栏模板 in the outlet sidebar 和内容模板 in the outlet content 但我不断在控制台中

  • 使用把手显示来自 parse.com 的 json 响应

    我想将 json 响应传递给车把 我已经查看了解析文档和 stackoverflow 问题 但我似乎无法弄清楚这一点 这是回应 results address 755 W Yale createdAt 2013 02 09T01 12 15

随机推荐

热门标签