Hey I have a couple strings of text
let text = [
"<strong>Voiijer</strong>" +
"is a global community of explorers of all ages who create and share expeditions",
"Everyone is an explorer, now everyone can explore. Voiijer is for everyone, from students to scientists.",
"Voiijer is for the naturally curious. <br />To tell the story of the world.",
];
that I am displaying like this
<p>{text[index]}</p>
with the index being the index of the carousal element but the html elements are just displaying as text. Anyone have any idea how to fix this?
You can show it with {@html text[index]}
However, according to the docs:
Svelte doesn't perform any sanitization of the expression inside {@html ...} before it gets inserted into the DOM. In other words, if you use this feature it's critical that you manually escape HTML that comes from sources you don't trust, otherwise you risk exposing your users to XSS attacks.
You should make sure your string is safe by yourself.