Is what I want possible, or do I need to rethink how I'm doing it?

[stobbsm]

I'm having a bit of an issue using templ. I've created components for common elements, and am having a great time. Loving templ, in general.

What I'm not getting, is I have a component that basically wraps a string in <p></p> tags, as is standard practice when writing articles and such.
What I'm not getting is how do I then place an anchor with href inside of that text block?

It get's HTML escaped, which is expected of course, but I'm obviously missing something here. If I was storing the text in a database (the eventual endpoint here), how would I have embeded a link so it doesn't get escaped while passing it to the component?

For reference, the very simple component for the paragraph:

package components

templ ContentP(content string) {
  <p>{ content }</p>
}

[joerdav]

In most cases with templ, you don't want to be passing other HTML elements as strings. You can leverage what we call block components...

package components

templ ContentP() {
  <p>{ children... }</p>
}

templ index() {
    @ContentP() {
        <a></a>
    }
}

[stobbsm]

Ok, but how would I do that with content loaded from a database? The link would still be within the flow of the paragraph around it.

I'm just trying to work out how to get <p>This paragraph with a <a href="#linktosite">link</a> to display properly, when it's coming from a database.

[joerdav]

You need to use templ.Raw.

templ ContentP(content string) {
  <p>@templ.Raw(content)</p>
}

Of course be very careful that you know that the html you are rendering is safe!

[stobbsm]

It would be vetted before getting stored in the database, so it will be safe HTML.
For static pages, I think I like the first option better. Keeps it much cleaner. Would be really great if there was a mechanism to store it in that format in a database somehow, but that would be needlessly complicated I think.

Thanks for the help! Guess a raw will do for the situation where I have an embedded link.