UI custom component: How to directly render HTML string from api and keep the styles

[Eleven_TW]

dangerouslySetInnerHTML and 'react-html-parser' are not working to transform the HTML string and showing nothing.

I used the simplest "Hello World" to test the covert but seems like not working.

when trying to use react-html-parser with encoded HTML string, it shows the decoded HTML string instead of the component;

if use the plain HTML string, it shows the error:
COMPONENT_ERROR_THROWN action type is dispatched with error details. TypeError: Cannot add property elm, object is not extensible

My real HTML string is much more complicated with nested lists, links, etc. I want to render the whole HTML as component so as for further actions like buttons/cards..., so the document.body.appendChild() is not ideal for my case.

Please kindly help!

Thanks

[Jesalyn S]

Hi Eleven_TW,

I recommend trying to use the <now-rich-text> component for this use case.

https://developer.servicenow.com/dev.do#!/reference/next-experience/utah/now-components/now-rich-tex...

Thanks!