Renderowanie szablonów w pomocnikach w kierownicy

Question

Hej!

Ponieważ wydaje się, że nie ma odpowiedzi na to: Passing variables through handlebars partial jeszcze, pracuję obecnie nad małym obejściem, aby uzyskać tę pracę. Chodzi o to, aby zarejestrować funkcję pomocnika, która renderuje określony szablon z możliwymi wartościami. Kod bitowy ułatwia zrozumienie.

ten sposób, że a i wywołać mój pomocnika:

<div> 
    {{myHelper}} 
</div> 

Ten pomocnik jest zarejestrowany w tym trochę kodu:

hbs.registerHelper(name, function (args) { 
    args = args || {}; 
    var template = hbs.compile(fs.readFileSync(__dirname + '/' + file, 'utf8')); 
    return template(args); 
}); 

Ja to snippiet w pętlę zarejestrować się w różnych pomocników pewnego razu. Oznacza to, że podane są "nazwa" i "plik".

Ok teraz jestem w stanie zrobić coś takiego:

// 'values' could be something like this: 

var values = { headline: 'HEADLINE' } 

<div> 
    {{myHelper values}} 
</div> 

obrębie pomocnika mogę teraz Sprawdza czy pewne wartości podano:

// myHelper template 

<div> 
    {{#if headline}} 
    <h1>{{headline}}</h1> 
    {{/if}} 
    <p>Lorem ipsum</p> 
</div> 

To małe obejście działa dla mnie , ale jest jeden problem. Rejestracja helpera, jak wyjaśniono powyżej, zwraca zwykły łańcuch zawierający znaki ucieczki HTML. Zatem wywołanie helpera nie powoduje wyprowadzenia renderowanego fragmentu kodu HTML. Wyprowadza kod HTML jako ciąg znaków ucieczkowych.

Czy ktoś z was ma pomysł, w jaki sposób mogę spowodować, aby fragment kodu zwrócił HTML jako HTML?

/Pascal

Answer 1

Od Handlebars doc:

Kierownice nie będzie uciec Handlebars.SafeString. Jeśli napiszesz pomocnika, który generuje własny kod HTML, zwykle będziesz chciał zwrócić nowy Handlebars.SafeString (wynik). W takiej sytuacji będziesz chciał ręcznie uciec od parametrów.

Spróbuj

hbs.registerHelper(name, function (args) { 
    args = args || {}; 
    var template = hbs.compile(fs.readFileSync(__dirname + '/' + file, 'utf8')); 

    // return new hbs.SafeString(template(args)); 
    // From @Maroshii 
    // the SafeString method must be accessed through hbs.handlebars 
    // and not directly through hbs 
    // https://github.com/donpark/hbs#handlebars 

    return new hbs.handlebars.SafeString(template(args)); 
}); 

Answer 2

Chciałbym tylko zwrócić uwagę, że przy użyciu nawiasów potrójne eliminuje konieczność uruchamiania żadnych dodatkowych metod przekonwertować do formatu HTML. Na przykład podczas uzyskiwania dostępu do danych szablonu wystarczy użyć potrójnych nawiasów klamrowych {{{templateData}}}, które umożliwiają uzyskanie surowego kodu HTML.