jsRender 模板在渲染后消失答案

【问题标题】：jsRender template disappears after renderingjsRender 模板在渲染后消失
【发布时间】：2012-07-16 17:31:09
【问题描述】：

在我的 jsRender 模板上调用 render 后，它似乎已被消耗，因此已从 DOM 中删除。这令人沮丧，因为我有一个页面需要根据用户交互多次呈现模板。

console.log($('#tpl'));
$('#container').html($('#tpl').render(json));
console.log($('#tpl'));

第二个 console.log 是一个空数组，我可以使用 DOM 检查器和 jsRender 抛出的异常确认模板不再存在：Uncaught JsRender Error: Unknown template: "#tpl" -- 必须重新加载页面才能将模板重新注入DOM。

如何在渲染之间保留 jsRender 模板？

【问题讨论】：

明显的愚蠢问题：您在容器元素中声明模板的脚本元素是什么？如果是这样，当然在容器上调用 .html() 会删除它...顺便说一句，您还可以从字符串编译模板。它不必在脚本元素中...
@BorisMoore 啊。傻我。不知何故，我阻止了 html() 方法将排除 <script> 标签的想法。不过这样就可以了！

【解决方案1】：

我仍然不确定为什么它必须被消耗并且在第一次渲染后根本不能留在 DOM 中，但我找到了一种解决方法。如果有人知道从 DOM 中删除模板的原因，我仍然很感兴趣。

更新：实际答案（谢谢，鲍里斯）

我的模板在我的#container 元素中，所以html() 方法当然会覆盖它。傻我。

~~解决方法~~无论如何都是巧妙的小技巧

使用this 'variant' example，我将模板保存在一个局部变量中。然后我在变量名而不是 jQuery 选择器上调用 render：

var tpl = $.templates('#tpl');

.
.
.

console.log(tpl);
$('#container').html(tpl.render(json));
console.log(tpl);

这也设法在渲染中保留模板。

【讨论】：

【解决方案2】：

我今天也遇到了类似的问题，我在正文中有两个目标 div 和两个脚本块模板。我的问题是我没有正确关闭 div 元素标签（xaml 太多），结果是第二个模板从未呈现，因为它找不到。

这是一个显示正确用法的 JsFiddle（而不是 /> 自关闭语法）：

希望对其他人有所帮助。

【讨论】：