使用 jquery-template {{wrap}} 包装纯文本答案

【问题标题】：Using jquery-template {{wrap}} to wrap plain text使用 jquery-template {{wrap}} 包装纯文本
【发布时间】：2011-06-22 21:19:13
【问题描述】：

使用 jQuery 模板，我尝试使用 {{wrap}} 模板标签来包装另一个模板的结果。第二个模板呈现纯文本，而不是 HTML。我目前得到一个空字符串，我希望在其中得到包装模板呈现的纯文本。

如果我用一些 HTML 元素（如 <div> 标记）包围纯文本，那么一切正常，但我将 <div> 渲染到结果中。我可以在我的内容周围创建一个虚拟标签以使 {{html}} 标签工作，但我不希望它出现在呈现的结果中。

如果可能的话，我还想使用相同的包装器来包装实际生成 HTML 的模板，所以如果相同的包装器模板可以同时适用于这两种情况会很好。

这是我的代码：

$("#x").html($("#myTmpl").tmpl());

<div id="x" />
<script id="myTmpl" type="text/x-jquery-tmpl">
  The following wraps some non-HTML content: {{wrap "#wrapper"}} help {{/wrap}}
</script>

<script id="wrapper" type="text/x-jquery-tmpl">
  <table>
    <tbody>
      <tr>
        <td>
          Wrapped content: {{html $item.html}}
        </td>
      </tr>
    </tbody>
  </table>
</script>

这段代码可以在这个jsFiddle找到：http://jsfiddle.net/bernardchen1/BYdeg/

【问题讨论】：

任何机会你都可以重构你的代码以使用{{tmpl}}标签（而不是{{wrap}}）
是的，但是我需要一个 {{tmpl}} 在我试图包装之前和之后。

标签： javascript jquery jquery-templates

【解决方案1】：

我最终找到了解决方案。我创建了使用虚拟标签来包装纯文本（甚至是由其他模板生成的 html），然后我创建了一个函数，我将其传递给模板调用，可以去除虚拟标签。我这样调用它：{{html $data.clean($item)}}。 “clean”函数需要访问内部模板返回的内容，我发现它是$item.wrapped[0]。获得该内容后，我可以从 clean 函数中返回其内部 html。

我担心我是否应该访问$item.wrapped。

最终，我可能只是尝试重构我的代码，使其不需要这个虚拟标签和清理功能。

这个解决方案可以在这里找到：http://jsfiddle.net/bernardchen1/nmzWt/

编辑：还有另一种解决方案是调用 appendTo 将模板 html 附加到另一个 DOM 元素，然后将数据抓取回来。

【讨论】：