Handlebars.js: используйте частичный, как обычный нормальный шаблон

Ответ 1

Если ваши шаблоны предварительно скомпилированы, вы можете получить доступ к своим частичным файлам через Handlebars.partials['partial-name'](), а также вызвать их из шаблона с помощью помощника {{> partial}}.

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

Пример:

function elementFromTemplate(template, context) {
    context = context || {};
    var temp = document.createElement('div');
    temp.innerHTML = templates[template] ? templates[template](context) : Handlebars.partials[template](context);
    return temp.firstChild;
}

myDiv.appendChild(elementFromTemplate('myPartial', context));

myDiv.appendChild(elementFromTemplate('a-whole-template'));

Надеюсь, это поможет любому, кто хочет использовать Handlebars, как я.

Ответ 2

Проще сделать это наоборот - скомпилировать все ваши шаблоны как обычные шаблоны, а затем сделать их доступными как частичные:

Handlebars.partials = Handlebars.templates

Это позволяет использовать ваши шаблоны, как обычно, и как частичные:

{{> normalTemplate}}

Ответ 3

Чтобы отобразить частичный из javascript, вы можете использовать

Handlebars.partials["myPartial"]()

Ответ 4

Чтобы использовать частичное из шаблона, просто включите {{> partialName}}.

<script id="base-template" type="text/x-handlebars-template">
  <div>
    {{> person}}  <!-- This is the partial template name -->
  </div>
</script>

<script id="partial-template" type="text/x-handlebars-template">
  <div class="person">
    <h2>{{first_name}} {{last_name}}</h2>
    <div class="phone">{{phone}}</div>
  </div>
</script>

<script type="text/javascript">
  $(document).ready(function() {
    var template = Handlebars.compile($("#base-template").html());

    //Aliasing the template to "person"
    Handlebars.registerPartial("person", $("#partial-template").html()); 

    template(yourData);
  }
</script>