Event handling with Blazor component inside Angular - not working

[robert-skarzycki]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

Event handlers for Blazor component embedded in Angular app are not triggered.

I've created a Razor component and embedded it in Angular app as custom element. Component contains button that should trigger event handler that is passed as parameter to the component.
I'm trying pass event handler to the component, using kebab-style attribute, but the event is not triggered. I've tried different options, even using "wrapping" with Angular https://github.com/aspnet/samples/tree/main/samples/aspnetcore/blazor/JSComponentGeneration, but nothing helped.

Expected Behavior

Event handler is triggered when button is clicked. In attached repro repo, it should print something into browser's console.

Steps To Reproduce

You can find reproduction repository there: https://github.com/robert-skarzycki/blazor-component-in-angular

Exceptions (if any)

No response

.NET Version

7.0.102

Anything else?

No response

[MackinnonBuck]

EventCallback parameters can only be passed using the "property syntax" as is described here: https://learn.microsoft.com/aspnet/core/blazor/components/?view=aspnetcore-7.0#pass-parameters.

The same applies for any types requiring JSON serialization.

Hope this helps!