@page "/"
<MatSelectItem @bind-Value="@inOutValue" Items="@allValues" >
<ItemTemplate>
<span style="color: #099;">@context?.Name</span>
</ItemTemplate>
</MatSelectItem>
@if(currentlySelectedCityStatus != null)
{
<p>Selected City: @inOutValue.Name</p>
<p style="font-weight:bold;">@currentlySelectedCityStatus</p>
}
@code
{
private const int METROPOLIS = 800000;
private city _inOutValue = null;
private city inOutValue
{
get => _inOutValue;
set
{
_inOutValue = value;
currentlySelectedCityStatus = (value.Population >= METROPOLIS)
? "its a metropolis"
: "its a city";
}
}
private string currentlySelectedCityStatus = null;
private IReadOnlyCollection<city> allValues = new List<city>
{
new city { Name="London", Population=7556900 },
new city { Name="Birmigham", Population=984333},
new city { Name="Liverpool", Population=864122 },
new city { Name="Nottingham", Population=729977 },
new city { Name="Sheffield", Population=685368 },
new city { Name="Bristol", Population=617280 },
new city { Name="Glasgow", Population=591620 }
};
class city
{
public string Name {get; set;}
public int Population {get; set;}
}
}