车把.js：嵌套模板剥离"safe" HTML

Question

我正试图使用一系列嵌套的Handlebars模板来呈现一组高度可变的数据，尽管使用了"三重存储"并返回了SafeString，但结果是完全去掉了HTML标记。

我有类似的数据：

{
  "type": "person",
  "details": [
    {"name": "firstname", "value": "joe"},
    {"name": "lastname", "value": "smith"},
    {
      "name": "company",
      "value": "acme",
      "details": [
        {"name": "address", "value": "123 Main St; Somewhere, CA"},
        {"name": "employees", "value": "10+"}
      ]
    }
  ]
}

我有几个这样的模板：

<template id="personDetails">
  <ul>
    {{{renderPersonDetails details}}}
  </ul> 
</template>
<template id="companyDetails">
  <ol>
    {{{renderCompanyDetails details}}}
  </ol> 
</template>

我将整个对象传递到第一个模板中。在模板中，我将"details"集合传递给一个注册的助手："renderPersonDetails"。前两个元素很简单，并作为两个LI元素返回。这些都很好。

当我们找到具有"details"属性的第三个元素时，我将此对象传递给companyDetails模板，该模板将依次将"detailes"集合传递给renderCompanyDetails助手。

renderCompanyDetails帮助程序的结果完全没有HTML，尽管：
1.我们使用三重存储
2.我们返回Handlebars.SafeString对象中的内容
3.如果我在返回之前将html输出到控制台，我会看到预期的html

显然这个例子可以大大简化。然而，由于数据的性质和渲染要求，我们的用例需要这种类型的处理。

顺便说一句，renderCompanyDetails帮助程序在帮助程序中构造HTML。如果我试图将数据从助手传递到第三个模板，并返回THAT，则HTML甚至在我渲染它之前就被完全剥离了…

Answer 1

您没有显示renderPersonDetails的源，但我敢打赌它只是返回一个字符串，而不是Handlebars.SafeString。

示例实现——而不是这个：

Handlebars.registerHelper('renderPersonDetails', function(data){
  var output = ...;
  return output;
});

这样做：

Handlebars.registerHelper('renderPersonDetails', function(data){
  var output = ...;
  return new Handlebars.SafeString(output);
});