Używanie zmiennych dla częściowego szablonu

Question

Zdecydowanie brakuje mi informacji o tym, jak działa kierownica. Muszę wywoływać różne częściowe w zależności od wartości zmiennej. Obecnie jedynym sposobem znalazłem to zrobić to:

<template name="base"> 
    {{#if a}}{{> a}}{{/if}} 
    {{#if b}}{{> b}}{{/if}} 
    {{#if c}}{{> c}}{{/if}} 
</template> 

aw analogicznym JS:

Template.base.a = function() { 
    return (mode === "a"); 
} 

Template.base.b = function() { 
    return (mode === "b"); 
} 

Template.base.c = function() { 
    return (mode === "c"); 
} 

... co wydaje mi się bardzo gadatliwy. Co ja naprawdę jak zrobić coś takiego jak:

<template name="base"> 
    {{> {{mode}} }} 
</template> 

Innymi słowy, wartość mode byłaby nazwa częściowe że jest tzw.

Wygląda na to, że musi to być bardzo powszechny przypadek użycia, ale nie mogę znaleźć żadnych przykładów tego w Internecie. Gdzie się pomyliłem?

Answer 1

Części są przechowywane w Handlebars.partials, dzięki czemu można uzyskać do nich dostęp ręcznie w swoim własnym pomocniku. Istnieje kilka trudnych bitów tu jednak:

1. Zawartość Handlebars.partials mogą być łańcuchami lub funkcje, więc trzeba skompilować partials przy pierwszym użyciu.
2. Kierownice nie wiedzą, czy częściowe będą text/plain lub text/html, więc będziesz musiał zadzwonić do swojego pomocnika odpowiednio w {{{...}}} lub {{...}}.
3. Te rzeczy nie są dokładnie udokumentowane (przynajmniej w żadnym miejscu, które mogę znaleźć), więc musisz wykonać inżynierię wsteczną źródła Handlebars i zadzwonić pod numer console.log(arguments), aby dowiedzieć się, jak korzystać z Handlebars.partials.
4. Musisz ręcznie przekazać this, gdy zadzwonisz do pomocnika.

Nie obawiaj się, to nie jest aż tak skomplikowane. Coś takiego prostego:

Handlebars.registerHelper('partial', function(name, ctx, hash) { 
    var ps = Handlebars.partials; 
    if(typeof ps[name] !== 'function') 
     ps[name] = Handlebars.compile(ps[name]); 
    return ps[name](ctx, hash); 
}); 

powinien załatwić sprawę. Następnie możesz powiedzieć:

{{{partial mode this}}} 

i zająć się bardziej interesującymi rzeczami.

Demo: http://jsfiddle.net/ambiguous/YwNJ3/2/

Answer 2

Aktualizacja 2016: Version 3 of handlebars addedDynamic Partials. Z dokumentacji:

Możliwe jest dynamiczne wybieranie części do wykonania przy użyciu składni wyrażeń podrzędnych.

{{> (whichPartial) }} 

oceni whichPartial a następnie renderowanie częściowe którego nazwa jest zwracana przez tę funkcję.

Podwyrażenia nie rozdzielają zmiennych, więc whichPartial musi być funkcją. Jeśli prosta zmienna ma częściową nazwę, możliwe jest jej rozwiązanie za pomocą pomocnika lookup.

{{> (lookup . 'myVariable') }}