javascript - Handlebars js : render multiple passes with nested templates

Question

我看到很多东西只是让我引用部分内容，这很糟糕，因为它们必须在布局上下文中构建。

我想做的是制作嵌套模板

例如:

<div id="person">
  {{name}}
  <div id="address">
    {{street}}
  </div>
</div>

<script>
  var outer = Handlebars.compile($('#person').html());
  outer({ name: 'someone special' });

  var inner = Handlebars.compile($('#address').html());
  inner({ street: 'somewhere cool' });
</script>

运行此程序时，内部模板永远不会呈现，因为外部模板会吞噬它。

如果您可以像这样命名嵌套模板，那就太好了:

{{> name}}
<div id="person">
  {{name}}
  {{> address}}
  <div id="address">
    {{street}}
  </div>
  {{/> address}}
</div>
{{/> name}}

<script>
  var outer = Handlebars.compile($('#person').html(), 'name');
  outer({ name: 'someone special' });

  var inner = Handlebars.compile($('#address').html(), 'address');
  inner({ street: 'somewhere cool' });
</script>

或类似的东西，这样当外部渲染时，它将保留该地址并让内部渲染自行寻址，而不将其从 DOM 中删除。

这样的事情可能吗？

提出这个问题的原因是我正在使用主干并希望将所有小 View 分开，但它会编译为一个文件。当外部采用 Handlebars 模板化时，其他一切都会破裂。我不想使用部分，因为这只会让设计者从 html 文档流程中取出所有内容。

编辑

我认为我真正需要的是一种执行{{noparse}}的方法，并且从registerHelper只返回noparse标签之间的原始html

Answer 1

<强> Here is a demo of a no-parse helper 。要使用此功能，您需要使用至少 v2.0.0-alpha.1 的版本。您可以从 Handlebars 上获取它build page 。 Here is the pull request that details about it .

这是相关代码。

模板

<script id="template" type="text/x-handlebars-template">
  <div id="person">
  {{name}}
    {{{{no-parse}}}}
      <div id="address">
        {{street}}
      </div>
    {{{{/no-parse}}}}
  </div>
</script>

Handlebars.registerHelper('no-parse', function(options) {
  return options.fn();
});