Using unescape HTML in lightning web component

I am currently having an issue to show the content fetched from salesforce database to UI. The data is stored in HTML form and I want it to show on UI using LWC without escaping HTML. Previously we were having specific component in lightning and VF page to unescape HTML and show the HTML content on UI. I am looking something similar to it.

Here is the code,

<template if:true={teamRecords} >
    <template for:each={teamRecords} for:item="team" for:index="index">
         <div class="col-md-3 col-sm-3 col-xs-12" key={team.item.siteComponent.Id}>
              <h4>{team.item.siteComponent.Title__c}</h4>
              <div lwc:dom="manual"> 
                   {team.item.siteComponent.Description__c} 
                   <!--I want to use the Unescape HTML here-->
              </div>
          </div>
    </template>
</template>

Answer

You can use:

<lightning-formatted-rich-text value={team.item.siteComponent.Description__c}></lightning-formatted-rich-text>

Attribution
Source : Link , Question Author : Tarique Shamim , Answer Author : Federico Sosa

Leave a Comment