Blazor IOT Dashboard demo

Blazor IOT Dashboard demo.razor

@page "/"

@using BlazorIOTDemo.Data
@inject DataService DataService

@if (myDatasDtos == null)
{
    <p><em>Loading datas...</em></p>
}
else
{
    <div class="container">
        <div class="row">
            <div>
                <table class="table">
                    <thead>
                        <tr>
                            <th>Id</th>
                            <th>Value</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var item in myDatasDtos)
                        {
                            <tr>
                                <td>@item.Id</td>
                                <td>@item.Value</td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>

            <div>
                <RadzenChart>
                    <RadzenLineSeries Data="@myDatasDtos" CategoryProperty="Id" ValueProperty="Value">
                        <RadzenMarkers MarkerType="MarkerType.Circle" />
                    </RadzenLineSeries>
                </RadzenChart>
            </div>
        </div>
    </div>
}

@code {
    protected override async Task OnInitializedAsync()
    {
        DataService.DataChanged += ServerDataChanged;
    }

    List<MyDataDto> myDatasDtos;

    private async void ServerDataChanged(object sender, List<MyDataDto> newDatas)
    {
        await InvokeAsync(() =>
        {
            Console.WriteLine("received data.");
            myDatasDtos = newDatas;
            StateHasChanged();
        });
    }
}