How to set language in a server-side rendering blazor app

48 Views Asked by At

I'm building a server-side rendering blazor app

where in Program.cs I have

builder
    .Services
    .AddRazorComponents()
    .AddInteractiveServerComponents();

and

app.MapRazorComponents<App>()
    .AddInteractiveServerRenderMode();

I built a language component like the code below, which doesn't seem to be working, or at least I don't see any change in localization for the other components

@using  System.Globalization
@inject IJSRuntime JSRuntime
@inject NavigationManager Nav

<select class="form-control" @onchange="ChangeLanguage">
    @foreach (var language in supportedLanguages)
    {
        <option value="@language">@language.DisplayName</option>
    }
</select>

@code
{
    CultureInfo[] supportedLanguages = new[]
    {
        new CultureInfo("en-US"),
        new CultureInfo("pt-PT"),
        new CultureInfo("fr-FR"),
    };

    private async Task ChangeLanguage(ChangeEventArgs e)
    {
        var culture = e.Value?.ToString();
        Console.WriteLine("culture is " + culture);
        if (!string.IsNullOrEmpty(culture))
        {
            await JSRuntime.InvokeVoidAsync("BlazorCulture.setCulture", culture);
        }
    }
}

If the other components are also already rendered and I want them to have the language updated how can I do it?

For example 2 components rendered use IStringLocalizer<App> _localize

But since I'm not change pages, and this is like a one page website, how can the components be re-rendered to take in account the changed language?

0

There are 0 best solutions below