How do I show a progress bar based on the server function execution time in Blazor?

The HTML “progress” element is used to show the progress. In the following code example, start and stop of progress can be executed on button click.

<progress value="@progressValue" max="100" style="width: 100%">@(progressValue.ToString() + " %")</progress>

<button @onclick="@startProgress">Start</button>

@code {

    private int progressValue { get; set; }

    private void startProgress()
    {
            for (int i = 0; i < 1000; i++)
            {
                this.progressValue = i;
            }
    }
 
}