jsRender рендеринг HTML - PullRequest
       8

jsRender рендеринг HTML

5 голосов
/ 10 января 2012

Я использую jsRender для отображения моих данных на html-странице. Данные отображаются идеально. Однако в некоторых элементах содержимого текст HTML (например, гиперссылка) отображается в виде текста. В шаблоне jquery есть способ визуализации HTML с помощью {{html. Есть ли что-нибудь подобное в jsRender? Мой код выглядит следующим образом:

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

Спасибо.

Ответы [ 4 ]

9 голосов
/ 07 марта 2012

Бета-кандидат JsRender уже вышел (см. Сообщение Бориса вчера вечером 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));​
​
6 голосов
/ 13 августа 2012

Используйте {{:Status}} для генерации HTML-кода.

2 голосов
/ 10 января 2012

Глядя на исходный код jsRender, я вижу, что плагин преобразует символы <,> и & в их сущности HTML. Может быть, вы можете попробовать изменить эти строки из jsRender

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

до

escapeMapForHtml = {
},

Помните о риске безопасности при вставке непроверенного HTML из внешних источников!

РЕДАКТИРОВАТЬ: ОК, проверка примеров (особенно 03_no-encoding.html) принесла другое решение. Итак, отмените предложенные ранее изменения и попробуйте использовать

{{=Status!}

Восклицательный знак должен помешать jsRender изменить HTML

0 голосов
/ 12 июля 2019

Попробуйте это ..

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