英文:
MudBlazor: Display customized text in Muti-select
问题
我正在尝试在MudBlazor的多选(Multi-Select)中显示自定义文本。
一切都正常，但显示的文本是"IndicatorDefinition"而不是自定义文本。
代码快速浏览：
<MudSelect Margin="Margin.Dense" T="IndicatorDefinition" MultiSelection="true"
SelectAll="true" SelectAllText="Select All"
@bind-SelectedValues="_selectedIndicators"
Style="width: 100px;" Clearable="true">
@foreach (var indicatorDefinition in IndicatorDefinitions)
{
<MudSelectItem Value="@indicatorDefinition">@indicatorDefinition.SubTitle</MudSelectItem>
}
</MudSelect>
@code {
public string Text {
get{
return $"{_selectedIndicators.Count()}/{IndicatorDefinitions.Count()} selected.";
}
set { var _ = value;}
}
public List<IndicatorDefinition> IndicatorDefinitions { get; set; } = new()
{
new () {SubTitle= "First"},
new () {SubTitle= "Second"}
};
public IEnumerable<IndicatorDefinition> _selectedIndicators = new List<IndicatorDefinition>();
public class IndicatorDefinition
{
public string SubTitle { get; set; }
public double Value { get; set; }
}
}
沙盒示例：https://try.mudblazor.com/snippet/wYQHaiuJGgaBWuxA
选择(Select)的参考文档：https://www.mudblazor.com/components/select#variants
我认为问题在于T的值为"IndicatorDefinition"而不是字符串(string)。我考虑了一种方法，即：
- 使用T = "string"。
- 将选定的值保存在List
中。 - 从List
重新构建_selectedItems。
但这并不是一种优雅的解决方案。
谢谢大家。
英文:
I'm trying to display customized text in multi-select of MudBlazor.
Everything is fine but the text displayed is "IndicatorDefinition" rather than the customized text.
A quick look of code:
<MudSelect Margin="Margin.Dense" T="IndicatorDefinition" MultiSelection="true"
SelectAll="true" SelectAllText="Select All"
@bind-SelectedValues="_selectedIndicators"
Style="width: 100px;" Clearable="true">
@foreach (var indicatorDefinition in IndicatorDefinitions)
{
<MudSelectItem Value="@indicatorDefinition">@indicatorDefinition.SubTitle</MudSelectItem>
}
</MudSelect>
@code {
public string Text {
get{
return $"{_selectedIndicators.Count()}/{IndicatorDefinitions.Count()} selected.";
}
set { var _ = value;}
}
public List<IndicatorDefinition> IndicatorDefinitions { get; set; } = new()
{
new () {SubTitle= "First"},
new () {SubTitle= "Second"}
};
public IEnumerable<IndicatorDefinition> _selectedIndicators = new List<IndicatorDefinition>();
public class IndicatorDefinition
{
public string SubTitle { get; set; }
public double Value { get; set; }
}
}
Sandbox here: https://try.mudblazor.com/snippet/wYQHaiuJGgaBWuxA
Reference of select here: https://www.mudblazor.com/components/select#variants
I think it's because the T is "IndicatorDefinition" rather than string. I thought of a way, which is:
- Use T = "string" instead
- Save selected value in List<string>
- Rebuild _selectedItems from List<string>.
But it's not elegant.
Thanks all.
答案1
得分: 1
你可以使用 ToStringFunc 函数委托。定义了如何在下拉列表中显示值，来源于 文档。
<MudSelect Margin="Margin.Dense" T="IndicatorDefinition" MultiSelection="true"
SelectAll="true" SelectAllText="Select All"
@bind-SelectedValues="_selectedIndicators"
Style="width: 100px;" Clearable="true"
ToStringFunc="@(e => e.SubTitle)">
@foreach (var indicatorDefinition in IndicatorDefinitions)
{
<MudSelectItem Value="@indicatorDefinition">@indicatorDefinition.SubTitle</MudSelectItem>
}
</MudSelect>
英文:
You can use the ToStringFunc func delegate.
Defines how values are displayed in the drop-down list , from docs
<MudSelect Margin="Margin.Dense" T="IndicatorDefinition" MultiSelection="true"
SelectAll="true" SelectAllText="Select All"
@bind-SelectedValues="_selectedIndicators"
Style="width: 100px;" Clearable="true"
ToStringFunc="@(e => e.SubTitle)">
@foreach (var indicatorDefinition in IndicatorDefinitions)
{
<MudSelectItem Value="@indicatorDefinition">@indicatorDefinition.SubTitle</MudSelectItem>
}
</MudSelect>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论