Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 118
Notice: A non well formed numeric value encountered in C:\ClientSites\reviewhostingasp.net\httpdocs\wp-content\plugins\crayon-syntax-highlighter\crayon_formatter.class.php on line 119
Currently there are many ways to extend or to organize Razor views in ASP.NET Core. Let us start with the new more complex ways. If your are familiar with previous ASP.NET MVC Frameworks you’ll definitely know most. But not almost all of that “old” stuff is still possible in ASP.NET Core MVC. Some of the listed below is completely new in ASP.NET Core. With this post, we’re going to try to write down all options to organize MVC Views in ASP.NET Core.
How To Organize Razor Views in ASP.NET Core
1. ViewComponents
This is one of new way to organize Razor views in ASP.NET Core. Sometimes you need to have something like PartialView, but with some more logic behind. In the past there was a way to use ChildActions to render the results of controller actions into a view. In ASP.NET Core, there is a new way (which I already showed in this post about ViewCmponents) with ViewComponents. This are a kind of mini MVC inside MVC, which means they have an own Controller, with an own single action and a view. This ViewComponents are completely independent from your current view, but also can get values passed in from your view. To render a ViewComponent you need to call it like this:
1 | @Component.Invoke("Top10Articles"); |
2. TagHelper
This little helpers are extensions of your view, which are looking like real HTML tags. In ASP.NET Core, you should use this TagHelpers instead of the HtmlHelpers because they are more cleaner and easier to use. Another huge benefit is Dependency Injection, which can’t be used with the HtmlHelpers, because the static context of extension methods. TagHelpers are common classes where we can easily inject services via the constructor. A pretty simple example on how a TagHelper could look like:
1 2 3 4 5 6 7 8 9 10 11 12 13 | [TargetElement("hi")] public class HelloTagHelper : TagHelper { public override void Process(TagHelperContext context, TagHelperOutput output) { output.TagName = "p"; output.Attributes.Add("id", context.UniqueId); output.PreContent.SetContent("Hello "); output.PostContent.SetContent(string.Format(", time is now: {0}", DateTime.Now.ToString("HH:mm"))); } } |
This guy defines a HTML Tag called “hi” and renders a p-tag and the contents and the current Time.
Usage:
1 | <hi>Emilyn Manuela</hi> |
Result:
1 | <p>Hello Emilyn Manuela, time is now: 18:55</p> |
ASP.NET Core MVC provides many built in TagHelpers to replace the most used HtmlHelpers. E. g. the ActionLink can now replaced with an Anchor TagHelper:
1 | @Html.ActionLink(“About me”, “About”, “Home”) |
1 | <a asp-controller=”Home” asp-action=”About”>About me</a> |
1 | <a href=”/Home/About”>About me</a> |
As you can see the TagHelpers feel more than HTML and they are easier to use and more readable inside the Views.
3. Dependency Injection
This is the biggest improvement to organize Razor views in ASP.NET Core. Yes, you are able to use DI in your View. Does this really make sense? Doesn’t it mess up my view and doesn’t it completely break with the MVC pattern? (Questions like this are currently asked on StackOverflow and reddit). We think, no. Sure, you need be careful and you should only use it, if it is really needed. This could be a valid scenario: If you create a form to edit a user profile, where the user can add its job position, the country where he lives, his city, and so on. We would prefer not to pass the job positions, the country and the cities from the action to the view. We would prefer only to pass the user profile itself and We only want to handle the user profile in the action. This is why it is pretty useful in this case to inject the services which gives me this look-up data. The action and the ViewModel keeps clean and easy to maintain.
Just register your specific service in the method ConfigureServices in the Startup.cs and use one line of code to inject it into your view:
1 | @inject DiViews.Services.ICountryService CountryService; |
ContryService in your View to fill a SelectBox with list of countries.4. Global View Configuration
Last but not least, there is a separate razor file you can use to configure some things globally. Use the _ViewImports.cshtml to configure usings, dependency injections and many more which should be used in all Views.
Conclusion
There are many new ways to extend and organize Razor views in ASP.NET Core. But you are free to decide which feature you want to use to get your problems solved. While there are many programming languages out there for a web developer to choose from, one of the most successful programming language till this date is ASP.NET. It has matured over the years with the latest version, ASP.NET Core, having a number of new features and enhancements. You may already have heard that ASP.NET hosting is offered by several web hosting providers. However, choosing the best cheap ASP.NET hosting isn’t an easy task. In this article, we have reviewed this best cheap ASP.NET Core 1.0 hosting provider according to our hosting review experience.