如何在使用jTemplate时将字符串呈现为html

时间:2012-11-27 11:23:07

标签: asp.net-mvc-3 jtemplates

我在我的视图中使用asp.net C#MVC jTemplate绑定公告集合到模板。 其中一个公告在其描述中有html字符串。

现在的问题是如何将该字符串呈现为html

我的观点就像

<textarea id="dashAnnoucement_Template" 
       data-template-name="dashAnnoucement_Template" class="hidden">
{#foreach $T as Announcement}
   <li id='{$T.Announcement$iteration}'>
   {#if !$().compare($T.Announcement.Category,
          @Convert.ToInt32(UI.Entities.AnnouncementCategory.RichText))}
      <div  class="card large flipped">
      <div class="pic">
      {#if $T.Announcement.LinkOff} 
         {#if $T.Announcement.Image.IsVideo}
           <a href="{$T.Announcement.LinkOff.Target}" class="play">
             <span>{$T.Announcement.Image.AltText}</span>
             <img alt="{$T.Announcement.Image.AltText}" 
                  src="{$T.Announcement.Image.Source}" class="thumb"/> 
           </a>
         {#else} 
           <a href="{$T.Announcement.LinkOff.Target}">
             <img alt="" src="{$T.Announcement.Image.Source}" class="thumb"/> 
           </a>
         {#/if} 
      {#else} 
        <img alt="" src="{$T.Announcement.Image.Source}" class="thumb"/>      
      {#/if}                       
      </div>
      <div class="content"><h3>   
      {#if $T.Announcement.LinkOff}                  
        <a href="{$T.Announcement.LinkOff.Target}" 
           target="{#if $T.Announcement.LinkOff.IsExternal}_blank{#else}_self{#/if}">
          {$T.Announcement.Title}</a>
      {#else}      
        {$T.Announcement.Title}                           
      {#/if}
      </h3>
      <p>{$T.Announcement.Summary}</p>
      </div>
      </div>
   {#else}
      {$T.Announcement.Description}
      @*Need to render this as html*@
   {#/if}
   </li>
{#/for}
</textarea>

jquery代码就像

$(Container).empty()
            .setTemplateElement(Template)
            .processTemplate(announcementsCollection);

我的Json数据,即announcementsCollection就像

[   {     "Category": 1,     "Title": "White Space Announcement Title",     "Description": "",     "Summary": "Join us Fri,April 24 in Atlanta,GA to mingle with Solavei members & hear top earner success stories",     "Image": {       "Source": "http://slvdev.blob.core.windows.net/media/1463/whitespace_1.jpg",       "AltText": "",       "Target": "",       "IsVideo": false     },     "Date": "\/Date(-62135596800000)\/",     "LinkOff": {       "Target": "http://solavei.com/",       "Text": "Learn More >",       "IsExternal": true     }   },   {     "Category": 1,     "Title": "Got Questions?",     "Description": "",     "Summary": "Access Member Support for information on your phone, your Solavei Membership, and your Solavei Mobile Service.",     "Image": {       "Source": "http://slvdev.blob.core.windows.net/media/7323/equipment-support-224x168.jpg",       "AltText": "",       "Target": "",       "IsVideo": false     },     "Date": "\/Date(-62135596800000)\/",     "LinkOff": {       "Target": "http://support.solavei.com",       "Text": "Learn More >",       "IsExternal": true     }   },   {     "Category": 4,     "Title": "html",     "Description": "<div class=\"imageBox shadowBox\" style=\"float: right; margin: -20px -20px 0px 20px;\">                                            \t                        <a target=\"_blank\" href=\"https://support-uat.solavei.com\">\t\t                        \t\t                        <img class=\"fullImage\" alt=\"\" src=\"http://slvdev.blob.core.windows.net/media/35985/neon.jpg\" style=\"height:170px\">\t                        </a>                                                                  </div>\n<div class=\"contents\">                                                            <h2>                                                    <a target=\"_blank\" href=\"https://support-uat.solavei.com\">                                                    Rich text                        </a>                        </h2>                                                                        <p>Access Member Support for information on your phone, your Solavei Membership, and your Solavei Mobile Service.</p>                                            </div>",     "Summary": "<div><img src='https://slvdev.blob.core.windows.net/media/35985/neon.jpg' wid/>\n<p>Test Message</p></div>",     "Date": "\/Date(-62135596800000)\/"   } ]

1 个答案:

答案 0 :(得分:0)

我知道这是一个老帖子,但是, 首先,您必须将JSon数据转换为Html代码 使用Html.Raw("")将代码显示为Html

@Html.Raw("Your html in here")