Search⌘ K
AI Features
Home
Courses
Building Web Applications with Blazor

Passing HTML Into Razor Components

Explore how to pass any arbitrary HTML into Razor components in Blazor. Understand the use of the RenderFragment type and the ChildContent parameter to embed HTML markup dynamically within components, enhancing customization and component behavior.

We'll cover the following...

Blazor allows us to pass any arbitrary HTML into Razor components. To demonstrate how this can be done, we have the following project setup. In this project, we are referencing a Razor component inside another Razor component and passing some arbitrary HTML into it.

<Router AppAssembly="@typeof(App).Assembly">
    <Found Context="routeData">
        <RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
        <FocusOnNavigate RouteData="@routeData" Selector="h1" />
    </Found>
    <NotFound>
        <PageTitle>Not found</PageTitle>
        <LayoutView Layout="@typeof(MainLayout)">
            <p role="alert">Sorry, there's nothing at this address.</p>
        </LayoutView>
    </NotFound>
</Router>
A Blazor project setup with a RenderFragment example

Consuming arbitrary HTML by Razor

...