Categories
ASP.NET Core

Service Injection into View in ASP.NET Core

This blog is about how dependency is injected directly into view. Let us look at it using a small example.

The following is a ColorListService class that returns a list of strings.

Note

Put all your services in a separate folder called Services. So this will help you maintain a project structure

ColorListService.cs

public class ColorListService
{
    public List<string> GetColors()
    {
        return new List<string>() { “Red”, “Blue”, “Green”, “Yellow”, “Violet” };
    }
}

Before you can use a service, you must register for the service. See ASP.NET Service Scope for more information

Startup.cs

public void ConfigureServices(IServiceCollection services)
{
    services.AddTransient<ColorListService>();
    services.AddControllersWithViews();
}

The following is a view code. Here the ColorListService is injected using @Inject Directive. Finally a list of colors is listed using foreach.

ServiceDemo.cshtml

@{
    Layout = null;
    ViewData[“Title”] = “Service Injection into View”;
}

@inject SampleMVCApplication.Services.ColorListService  colors

<h4>Service Injection into View in ASP.NET Core</h4>

@foreach (string item in colors.GetColors())
{
    <div>@item</div>
}

Below is a HomeController code. It has a ServiceDemo() action which will render a ServiceDemo view.

HomeController.cs

public class HomeController : Controller
{
    public IActionResult ServiceDemo()
    {
         return View();
    }
}

The following is the output of the above code

Service Injection into View

This blog explains how to inject the service directly into the view with a small example.

If you have any questions, please leave a comment below.

Categories
ASP.NET Core

Populating Dropdown using Dependency Injection into View in ASP.NET Core

This blog explains how to load a drop-down list in View using a dependency injection, without passing the value from the controller. So that it will reduce the request to the controller. Let us see how to achieve this.

In this blog I have explained two types of drop-down list loading methods. The first one is a list of classes,  the second one is a list of strings. The following are Metals and OptionServices classes. The OptionServices provide a list of colors and a list of metal information (metal name and symbol)

 public class Metals
 {
  public string MetalName { get; set; }
  public string Symbol { get; set; }
 }

 public class OptionServices
 {
  public List<Metals> ListMetals()
  {
    return new List<Metals>()
    {
     new Metals(){ MetalName= “Gold”, Symbol=”Au” },
     new Metals(){ MetalName= “Platinum”, Symbol=”Pt” },
     new Metals(){ MetalName= “Silver”, Symbol=”Ag” }
    };
  }

  public List<string> ListColors()
  {
    return new List<string>() { “Red”, “Blue”, “Green”, “Yellow”, “Violet” };
  }
 }

To use the service, you must register the service in the ConfigureServices  method in the Startup.cs file.

public void ConfigureServices(IServiceCollection services)
{
    services.AddTransient<OptionServices>();
    services.AddControllersWithViews();
}

The one below is the view code. Here I have injected the OptionServices  into view and loaded it into the dropdown list

PopulateDropDown.cshtml

@using SampleMVCWebApplication.Services
@inject OptionServices  Options

<h4>Populate Drop Down List</h4>

Select a Metal: @Html.DropDownList(“metal”, Options.ListMetals().Select(c => new SelectListItem() { Text = c.MetalName, Value = c.Symbol }))

<br />
<br />

Select a Color: @Html.DropDownList(“color”, Options.ListColors().Select(c => new SelectListItem() { Text = c, Value = c }))

The following is a controller code. We do not need to pass any values here to load the drop-down list

public class HomeController : Controller
{
    public IActionResult PopulateDropDown()
    {
        return View();
    }
}

The following is an output of the above code.

Populating-Dropdown

This article explains how to load the dropdown using service with a small example.

If you have any questions about this please leave a comment below.