Render Blazor components from JavaScript - How to Update a Blazor component parameter from JavaScript after component render

Question

I am rendering a Blazor component in a HTML document from JavaScript. It is working 100% but once my Blazor component has rendered, I can not update one of the component parameters. This example is in the.Net 6 RC1 spec. I would appreciate some help on two way binding of a parameter.

Code in my HTML file:

<script>
     async function loadComponent() {
    
      let containerElement = document.getElementById('my-counter');
    
      await Blazor.rootComponents.add(
       containerElement, 
      'counter', { currentCount: count });
    };

</script>

I want to update "Count" after the component is rendered.

See here for the Microsoft.Net6 RC1 notes.

Answer 1

I have only an idea for one way (blazor->JS).

You could define a JS-function that increment the counter and call it with blazor.

calling a JS fcuntion

Answer 2

Did you define in startup.cs? Do you use the server or wasm host model? Do you want to update it from js or from the razor component?

After component is rendered like this it should be responsive