#4 Razor Components with @Html.Partial and DynamicModel
Reuse Shared Templates
Partial templates are cshtml files which you can use multiple times. Typically they will contain something which you need in many places, like a menu or a data-visualizer which gets data as a parameter, and then creates a different table each time. Here's how to use it with Html.Partial(...) (or RenderPage in older versions).
Just render the same, external file into here
This uses @Html.Partial to get the file line.cshtml 3 times.
Output
@Html.Partial("line.cshtml")
@Html.Partial("line.cshtml")
@Html.Partial("line.cshtml")Source Code of line.cshtml
@inherits Custom.Hybrid.Razor14
<hr style="height: 10px; border: 1; box-shadow: inset 0 9px 9px -3px rgba(11, 99, 184, 0.8); border-radius: 5px;">
Passing in values
The next example passes in a word to the sub-template, so that can change what it does based on the variable. The called template will get the parameters on DynamicModel (see code below)
Output
Hello, this is the first line
Second line!
I'm last!
@Html.Partial("box.cshtml", new { Label = "Hello, this is the first line" })
@Html.Partial("box.cshtml", new { Label = "Second line!", Color = "red" })
@Html.Partial("box.cshtml", new { Label = "I'm last!", Color = "blue" })Source Code of box.cshtml
@inherits Custom.Hybrid.Razor14
@{
// pick up parameters which were passed in
var label = DynamicModel.Label;
var color = DynamicModel.Color as string ?? "black"; // default to "black" if not provided
}
<div style="border: solid 2px @color">
@label
</div>
#4 Razor Components with @Html.Partial and DynamicModel
@inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade;
<!-- unimportant stuff, hidden -->
<div @Sys.PageParts.InfoWrapper()>
@Html.Partial("../shared/DefaultInfoSection.cshtml")
<div @Sys.PageParts.InfoIntro()>
<h2>Reuse Shared Templates</h2>
<p>
Partial templates are <code>cshtml</code> files which you can use multiple times. Typically they will contain something which you need in many places, like a menu or a data-visualizer which gets data as a parameter, and then creates a different table each time. Here's how to use it with <code>Html.Partial(...)</code> (or <code>RenderPage</code> in older versions).
</p>
</div>
</div>
<h3>Just render the same, external file into here</h3>
<p>This uses <code>@@Html.Partial</code> to get the file <code>line.cshtml</code> 3 times.</p>
@Html.Partial("line.cshtml")
@Html.Partial("line.cshtml")
@Html.Partial("line.cshtml")
<h3>Passing in values</h3>
<p>The next example passes in a word to the sub-template, so that can change what it does based on the variable. The called template will get the parameters on <code>DynamicModel</code> (see code below)</p>
@Html.Partial("box.cshtml", new { Label = "Hello, this is the first line" })
@Html.Partial("box.cshtml", new { Label = "Second line!", Color = "red" })
@Html.Partial("box.cshtml", new { Label = "I'm last!", Color = "blue" })
@* Footer *@
@Html.Partial("../Shared/Layout/FooterWithSource.cshtml", new { Sys = Sys })