Dependency Injection In Blazor Component file

6
votes

I have a blazor component in my application:

public class IndexComponent : ComponentBase
{
    public string ContentRoot { get; set; }
    public string WebRoot { get; set; }
    private IHostingEnvironment HostingEnvironment;

    public IndexComponent(IHostingEnvironment hostingEnvironment)
    {
        HostingEnvironment = hostingEnvironment;
    }

    protected override async Task OnInitAsync()
    {
        //Some Code Here
    }
}

I am trying to use DI in my app , for example IHostingEnvironment.

Code give no compile time error here but when i run it than in code behind file of this razor (Index.razor.g.cs file):

public class Index : IndexComponent

at this line it says:

There is no argument given that corresponds to the required formal parameter hostingEnvironment of IndexComponent.IndexComponent

This can be solved by using @inject IHostingEnvironment in Razor file but I am moving my function block from Razor to IndexComponent.cs file so need it there.

Neither of it works in below way:

[Inject]
IHostingEnvironment HostingEnvironment

What will work here?

Note: No use of ViewModel

Update 1

In StartUp.cs by adding namespace 

using Microsoft.AspNetCore.Hosting.Internal;

And than

services.AddSingleton<IHostingEnvironment>(new HostingEnvironment());

It is now able to register IHostingEnvironment on client side project but it does not have values for its properties (contentrootpath and webrootpath).

Only one thing is available here which is EnvironmentName and its value is always Production ,

3
c#asp.net-coreblazorblazor-client-side
They are nothing wrong in your code. It looks like you are creating some new index or index component by hand somewhere. – dani herrera
@daniherrera yes , this is the standrad way to seprate your code from html markup in another file and inherit ComponentBase in that class file , Everything is fule untill we use Dependency Injection in ASP.Net Blazor. It is giving error – Saurabh
I use DI on code components extensively without problems. Are you trying to create a new instance of component by hand in someplace? This kind of errors ( missing DI element) are usually raised on run time not in compiling time. – dani herrera
No , there is no use of new keyword to create instance of component – Saurabh
@daniherrera Please see Update 1 – Saurabh

3 Answers

10
votes

Update:

The error is from WebAssembly, so it is a client-side app. There is no HostingEnvironment on the client and therefore the service is not registered. It would be useless if it was.

So, step back: Why do (you think) you need it?

You should make it a protected or public read/write property:

// in IndexComponent
[Inject]
protected IHostingEnvironment HostingEnvironment { get; set; }

and remove the constructor parameters.

Side note: IHostingEnvironment is marked as obsolete.

2
votes

It turns out that for Blazor you need a slightly different interface, namely IWebAssemblyHostEnvironment.

From this documentation, what you should inject is:

@inject IWebAssemblyHostEnvironment HostEnvironment
1
votes

From this comment:

WASM: System.InvalidOperationException: Cannot provide a value for property 'HostingEnvironment' on type 'JewelShut.Client.Pages.Index'. There is no registered service of type 'Microsoft.AspNetCore.Hosting.IHostingEnvironment'

I'm guessing this is a client side Blazor application. (My apologies if I'm wrong with my guess.). On client side Blazor the IHostingEnvironment is not registered by default in DI container. Still the error says that the service you are trying to inject is not registered. To register a service:

In the Startup.cs: 

public void ConfigureServices(IServiceCollection services)
{
    //few sample for you
    services.AddScoped<AuthenticationStateProvider, ApiAuthenticationStateProvider>();
    services.AddAuthorizationCore();

    //register the required services
    //services.Add...
}

If the injected service is registered the way @Henk Holterman has suggested is the right answer.

Di in blazor