Pass HTML string to partial or view

[MightyMoud]

Hi guys,

I'm trying to render HTML that is coming from a different server. So I have a placeholder in my edge template looking like this

      <div class="text-[--text-muted]">
                {{msg.aiMessage}}
       </div>

The problem is that this is not being parsed as HTML by browser, it's rendered as string inside the div.

So I tried to do this:

Define the template as raw string:

    const template = `<div hx-swap-oob="beforeend:.chat-body">
        <div class="p-2 bg-[--neutral-300] rounded-md flex flex-col gap-2 ">
            <div class="text-[--text-muted]" data-controller="welcome" data-course-slug="${
              course.slug
            }">
                ${msg.aiMessage.replace('\n', '<br/>')}
            </div>
        </div>
    </div>
    `

then use renderRaw return await view.renderRaw(template)

This does work, but it also means I maintain my partial as a string now...

Any better way to do this?

[RomainLanz]

Hey @ms-mousa! 👋🏻

You have to use 3 curly braces not to escape the given string.

<div class="text-[--text-muted]">
  {{{ msg.aiMessage }}}
</div>

📚 https://docs.adonisjs.com/guides/views/templating-syntax

[MightyMoud]

Thank you very much! Read through this page multiple times and still manage to miss it! 😁