Question

我在项目中使用express-handlebars时遇到以下问题：

问题我希望能够在视图的内部局部添加<script>这类标记到我的整体视图中。

示例：

视图

{{#layout/master}}
{{#*inline "head-block"}}
<script src="some/source/of/script">
{{/inline}}
...
{{>myPartial}}
{{/layout/master}}

该视图扩展了我用作布局的另一个局部（布局/母版）。它通过内联部分符号将其内容添加到那些head头块中，效果很好

部分“ myPartial

<script src="another/script/src/bla"></script>

<h1> HELLO </h1>

现在，我希望将其中的特定脚本标记添加到我的视图标题栏中。我尝试使用@root表示法，但只能在其中引用上下文。不变。

我知道我可以使用jquery或类似工具通过引用文档标题等来添加内容。但是我想知道是否可以通过把手操作。

我确实以任何方式怀疑。但是，如果您有任何想法或建议，请发送给我！非常感谢！

Answer 1

更新

如果您在布局/视图中注入了多个内容，则此方法将无效。由于这种情况是在浏览器加载页面时发生的，因此会创建某种竞争条件，帮助者必须收集必须注入到父文件中的内容。如果不够快，将在帮助程序解析之前构建DOMTree。总而言之，这种解决方案不是我所希望的。我将进行更多研究并尝试找到更好的解决方案...

这就是我的做法。感谢Marcel Wasilewski对帖子的评论，并指出了正确的事情！

我使用了handlebars-extend-block助手。我没有安装该软件包，因为它不直接与express-handlebars兼容（免责声明：有一个软件包声明确实如此，但它只会给我带来错误）因此，我只使用了他定义的助手，就从github复制了它们（我当然是链接到他的仓库并归功于他！），就像这样：

var helpers = function() {

// ALL CREDIT FOR THIS CODE GOES TO: 
// https://www.npmjs.com/package/handlebars-extend-block
// https://github.com/defunctzombie/handlebars-extend-block

var blocks = Object.create(null);

return {

    extend: function (name,context) {
        var block = blocks[name];
        if (!block) {
            block = blocks[name] = [];
        }

        block.push(context.fn(this));
    },
    block: function (name) {
        var val = (blocks[name] || []).join('\n');

        // clear the block
        blocks[name] = [];
        return val;
    }
}
};
module.exports.helpers = helpers;

然后我将它们要求放入我的快速车把实例中，如下所示：

let hbsInstance = exphbs.create({
        extname: 'hbs',
        helpers: require('../folder/toHelpers/helpersFile').helpers() ,
        partialsDir: partialDirs
    });

进入我的中心layout/master文件，该文件由我的Partial视图扩展，并将其添加到其<head>部分

{{{block 'layout-partial-hook'}}}

（因为内容为HTML，所以需要三括号）。其他把手将无法识别

然后在部分本身中添加如下内容：

{{#extend "layout-partial-hook"}}
    <link rel="stylesheet" href="/css/index.css"/>
{{/extend}}

那就成功了！谢谢!!!

把手-将内容从局部添加到视图中

1 个答案: