jsRender 渲染 HTML答案

【问题标题】：jsRender Rendering HTMLjsRender 渲染 HTML
【发布时间】：2012-02-06 18:47:12
【问题描述】：

我正在使用 jsRender 在 html 页面上呈现我的数据。数据得到完美呈现。但是，在某些内容项中，HTML 文本（如超链接）显示为文本。在 jquery 模板中，有一种方法可以通过 {{html. jsRender 中是否有类似的东西可用？我的代码如下：

<p>
{{ =Status}}   //need to convert this to HTML so it should appear as hyperlink.
</p>

谢谢。

【问题讨论】：

标签： jquery html templates jsrender

【解决方案1】：

JsRender beta 候选版现已推出（参见 Boris 昨晚发的帖子 http://www.borismoore.com/2012/03/approaching-beta-whats-changing-in_06.html）

我写了一个快速的小提琴来展示如何在这里呈现 HTML：http://jsfiddle.net/johnpapa/NfUGB/

基本上，只需使用 {{>yourProperty}} 标签来呈现它的 HTML 编码。使用 {{:yourProperty}} 跳过编码。

<script id="template" type="text/x-jsrender">
    <p>
    {{:foo}}
    </p>
    <ul>
    {{for testData}}
        <li>{{:name}} - {{:markup}} - {{>markup}}</li>
    {{/for}}
    </ul>
</script>
<div id="div1"></div>

var vm = {
    foo: "names",
    testData: [
        {
            name: "John", 
            markup: "<span style='background: yellow'>John</span>"
        },
        {
            name: "Boris", 
            markup: "<span style='background: orange'>Boris</span>"
        }
    ]
};

$("#div1").html($("#template").render(vm));

【讨论】：

【解决方案2】：

使用{{:Status}} 生成 HTML 代码。

【讨论】：

【解决方案3】：

查看 jsRender 的源代码，我可以看到该插件将和 & 字符转换为它们的 HTML 实体。也许您可以尝试从 jsRender 更改这些行

escapeMapForHtml = {
    "&": "&amp;",
    "<": "&lt;",
    ">": "&gt;"
},

到

escapeMapForHtml = {
},

注意从外部来源插入未经检查的 HTML 的安全风险！

编辑：好的，检查示例（尤其是 03_no-encoding.html）带来了另一种解决方案。所以继续撤消我之前提出的更改并尝试使用

{{=Status!}

感叹号应该防止 jsRender 改变 HTML

【讨论】：

它不起作用。它将 HTML 视为字符串并放在“”中。例如
"gmail.com" title="单击以在新窗口或标签中打开" target="_blank">gmail.com</a>"</p>
也许您应该删除答案的第一个（非工作）部分？
那么 cmets 将不再适合答案。我想我会保持“原样”
在 JsRender 中更改这些行不是一个好主意。之前的转义语法是 {{=Status}}，而不转义的语法是 {{=Status!}}。对于最近的 beta 候选，语法是 {{>Status}} 用于转义，{{:Status}} 用于不转义。下面约翰爸爸的回答是正确的......

【解决方案4】：

试试这个..

<p>
{^{ =Status}}   
</p>

【讨论】：