首页 > 解决方案 > 使用从 JS 代码到静态 Blazor 方法的注入服务

问题描述

我有一个使用 jQuery 库来显示“确认”对话框的应用程序。

当用户在对话框上单击“确定”或“取消”时,首先对我的 Javascript 代码进行回调。从那里我根据用户做出的决定调用 Blazor 方法。

这一切看起来像这样:

我的js代码:

$('.alert-yesno).on('click', function() {
    // For simplicity I immediately call the Blazor method
    DotNet.invokeMethodAsync('[Assembly name]', 'DoSomething')
                            .then(data => {
                                // do something...
                            });
});

Blazor 页面:

@inject MyService MyService

<button class="alert-yesno">Show dialog</button>

@code
{
    [JSInvokable]
    public static async Task DoSomething()
    {
        // How to use the non static MyService here...?
    }
}

这一切都很好。Javascript 部分调用我的 Blazor 方法。但是我怎么MyService能从那里使用呢?这被注入到页面中。这很好,因为它利用了依赖注入。

我不想new每次都从static方法中创建一个实例,因为这样我就失去了所有自动注入的依赖项。

我该如何解决这个问题?

标签: c#.net-coreblazorblazor-server-side

解决方案


有关更完整的示例,请参阅https://docs.microsoft.com/en-us/aspnet/core/blazor/javascript-interop?view=aspnetcore-3.0#instance-method-call ,但您可以传递对通过调用 .net 实例到 javascript 代码

DotNetObjectReference.Create(myInstance);

然后 javascript 代码可以调用该对象的实例方法。由于组件(以及注入其中的服务)的生命周期可能与 jquery click 处理程序不同,这可能会导致一些其他问题,但上面的链接应该是一个很好的起点。


推荐阅读