Using templated components

To build a Razor component, component parameters are the channels for parent and child communication. In Chapter 9, Razor Components and Data Binding, we introduced nested components. We mentioned a special ChildContent component parameter of the RenderFragment type. The parent component can set the content of the child component with this parameter. For example, the content of MenuItem in the following code can be set to an HTML string:

<MenuItem Id="@_dialogDeleteId">
  <strong>Delete</strong>
</MenuItem>

We can do this because MenuItem defines the following component parameter as we can see in Listing 10.6:

[Parameter]
public RenderFragment ChildContent { get; set; }

If we want to explicitly specify the ChildContent parameter, we can do this as well:

<MenuItem Id="@_dialogDeleteId">
  <ChildContent>
    <strong>Delete</strong>
 ...