Liam Kenny
Liam Kenny

Reputation: 307

MatBlazor MatSelect in global component - options disappear when navigating components

I have a MatSelect component which lives in my global Top-Bar component. The values load fine on first load, but when I navigate to another component, bearing in my the Top-Bar doesnt go anywhere, my options disappear on the front end, despite the list still being populated

<MatSelect TValue="Guid"
           Value="ActiveCompanyStateServices.ActiveCompany"
           ValueChanged="SetActiveCompany">
    @foreach (var company in ActiveCompanyStateServices.Companies)
    {
        <MatOption Value="company.Id">@company.Name</MatOption>
    }
</MatSelect>

@code {
        protected override async Task OnAfterRenderAsync(bool firstRender)
        {
            await ActiveCompanyStateServices.InitializeState();
            await base.OnAfterRenderAsync(firstRender);
        }

}

MainLayout.razor

<main>
    <div class="top-row px-4">
        <span>@PageManager.FullPagePath</span>
        <span style="flex:1 1 auto"></span>
        <CompanySelect />
    </div>

    <article class="content px-4">
        @Body
    </article>
</main>

Please note that the code is incomplete, just for demo purposes

Upvotes: 0

Views: 17

Answers (0)

Related Questions