Model-bound views
Model-bound views use the default SitecoreComponentViewComponent
view component, so you do not need to create a view component class.
When you have created your Razor view in the /Views/Shared/Components/SitecoreComponent
folder and your view model class, you must map the Layout Service response to the view component with the AddModelBoundView<TModel>()
extension method.
In the following example:
-
AddModelBoundView<BoundContentBlock>("ContentBlock")
maps theContentBlock
response component to the defaultSitecoreComponentViewComponent
view component; uses theContentBlock.cshtml
view; and provides the view with theBoundContentBlock
model. -
AddModelBoundView<BoundGenericBlock>(name => name.StartsWith("sc"), "GenericBlock")
maps all response components prefixed withsc
to theGenericBlockViewComponent
view component; uses theGenericBlock.cshtml
view; and provides the view with theBoundGenericBlock
model.
public void ConfigureServices(IServiceCollection services)
{
var renderingEngineBuilder = services.AddSitecoreRenderingEngine(options =>
options
.AddModelBoundView<BoundContentBlock>("ContentBlock")
.AddModelBoundView<BoundGenericBlock>(name => name.StartsWith("sc"), "GenericBlock")
);
}
Accessing Sitecore content from model-bound view component Razor views
The Razor view of a model-bound view component uses a strongly-typed model that binds to properties in the Layout Service response.
The Razor view:
@model MyRenderingHost.ComponentModels.ContentBlock
<section>
<h2 asp-for="Model.Heading"></h2>
<div>
<sc-text asp-for="Model.Content"></sc-text>
</div>
</section>
The ContentBlock
model accessed in the Razor view:
using Sitecore.LayoutService.Client.Response.Model.Fields;
namespace MyRenderingHost.ComponentModels
{
public class ContentBlock
{
public TextField Heading { get; set; }
public RichTextField Content { get; set; }
}
}