Skip to content

Latest commit

 

History

History
28 lines (22 loc) · 2.69 KB

blazor-in-asp-net.md

File metadata and controls

28 lines (22 loc) · 2.69 KB
title description type page_title slug position tags ticketid res_type
Telerik Blazor in ASP.NET Web Application
Use Telerik Blazor components in ASP.NET Web Application.
how-to
Telerik Blazor in ASP.NET Web Application
telerik-blazor-in-asp-net-app
1422791
kb

Description

You may have an ASP.NET Core 3 web application and you may want to start using Blazor components in it so you can modernize it, and even to eventually migrate it to Blazor.

Considerations

You can use an ASP.NET Core 3 web application to render Blazor components. Here is a list of the requirements and things to keep in mind (as sample project is available at the end):

  • You must first add Blazor to the project. This includes the client-side assets, the service, and the SignalR hub. In the sample project, they are added to the layout so that all pages can use them. Make sure you don't add them twice on a certain page.
  • You must then [add the Telerik components as usual]({%slug getting-started/what-you-need%}). The TelerikRootComponent must be added around the contents of every Blazor component, because there is no way to render it in a shared location like in an actual Blazor app.
  • Use Blazor components according to the current framework approach. At the time of writing, that is the <component type="typeof(MyComponent)" render-mode="ServerPrerendered" param-SomeParameter="@ObjectToPass" /> approach. In previous versions the recommended approach was using Razor components like partial views - through the Html.RenderComponentAsync() helper where you passed their Parameters as fields in an anomymous model object.
  • If you wish to use [Alert, Confirm or Prompt Dialogs]({%slug dialog-predefined %}), you need to do this in a nested Razor component of the TelerikRootComponent. Otherwise, if you try to define the DialogFactory CascadingParameter in the same Razor component that includes the TelerikRootComponent, then the cascading parameter will be null.
  • If you are already using Kendo widgets in such a project, make sure to only use the [Telerik UI for Blazor Themes]({%slug general-information/themes%}). They match the SASS-based themes from Kendo and you must only have one theme referenced.
    • Try using versions of Kendo UI and UI for Blazor that are close together, so that there are as little differences in their theming as possible. The latest versions are advisable.

tip A sample project with comments is available in the following repo that contains other examples as well: https://github.com/telerik/blazor-ui/tree/master/common/razor-components.