使用从 JS 代码到静态 Blazor 方法的注入服务
Use injected service from JS code to static Blazor method
我有一个应用程序使用 jQuery 库来显示 'confirmation' 对话框。
当用户在对话框中单击 'OK' 或 'Cancel' 时,首先会回调我的 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
呢?这被注入到页面中。这很好,因为它利用了依赖注入。
我不想每次都在 static
方法中创建一个 new
实例,因为这样我就失去了所有自动注入的依赖项。
我该如何解决这个问题?
有关更完整的示例,请参阅 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 单击处理程序不同,这可能会导致一些其他问题,但上面的 link 应该是一个很好的起点.
我有一个应用程序使用 jQuery 库来显示 'confirmation' 对话框。
当用户在对话框中单击 'OK' 或 'Cancel' 时,首先会回调我的 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
呢?这被注入到页面中。这很好,因为它利用了依赖注入。
我不想每次都在 static
方法中创建一个 new
实例,因为这样我就失去了所有自动注入的依赖项。
我该如何解决这个问题?
有关更完整的示例,请参阅 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 单击处理程序不同,这可能会导致一些其他问题,但上面的 link 应该是一个很好的起点.