handlebars - добавить контент в заголовок из частичного - PullRequest
Новая
       35

handlebars - добавить контент в заголовок из частичного

0 голосов
/ 13 ноября 2018

Я использую express-handlebars в моем проекте, и у меня возникла следующая проблема:

Вопрос Я хочу иметь возможность добавить <script> или такие теги к моим общим представлениямчастичная часть, которая вызывается внутри представления.

Пример:

представление 

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

представление расширяет другую часть (схемы / мастер), который я использую в качестве макета.Он добавляет свое содержимое в этот головной блок через встроенную частичную запись, которая прекрасно работает

Частичное "myPartial 

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

<h1> HELLO </h1>

Теперь я хотел бы этот конкретный скрипттег, добавляемый в мой головной блок просмотров. Я попытался перейти через нотацию @root, но могу ссылаться только на контекст. Ничего не изменить.

Я знаю, что мог бы использовать jquery или подобное, просто добавивсодержание, ссылаясь на заголовок документа и т. д. Но я хотел знать, возможно ли это вообще с помощью руля.

Я сомневаюсь, что это каким-либо образом. Но если у вас есть какие-либо идеи или предложения, пожалуйста, отправьтеим мой путь! Большое спасибо !!!

1 Ответ

0 голосов
/ 15 ноября 2018

UPDATE

Это не сработает, если в макет / представление добавлено более одного элемента. Поскольку это происходит, когда браузер загружает страницу, он создает некие условия гонки, в которых помощники должны собирать вещи, которые должны быть внедрены в родительский файл. Если это не достаточно быстро, DOMTree будет построен, прежде чем помощник решит. В общем, это решение не то, на что я надеялся. Я буду исследовать больше и постараюсь найти лучший ...

Вот как я это сделал. Спасибо Марселю Василевски, который прокомментировал этот пост и указал мне на правильную вещь!

Я использовал помощник 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}}

И это сработало! Спасибо !!!

...