动态绑定输入字段 blazor答案

【问题标题】：Dynamically binding input-field blazor动态绑定输入字段 blazor
【发布时间】：2021-02-25 21:00:13
【问题描述】：

我正在尝试构建输入字段的动态列表，同时我从多选下拉列表中选择项目。那么如何将变量动态绑定到与从多选下拉列表中选择的 id 绑定的已创建文本字段。

这就是我所做的。

<MudGrid>
   <MudItem xs="12" md="12">
        <MudSelect T="Parts" Label="US States" HelperText="Pick your favorite states" MultiSelection="true" @bind-Value="value" @bind-SelectedValues="options">
            @foreach (var part in parts)
            {
                <MudSelectItem T="Parts" Value="@part">@part.PartsValue</MudSelectItem>
            }
        </MudSelect>
    </MudItem>
    @foreach (Parts item in options)
    {
        int i = 0;
        <MudItem xs="3" sm="3" md="2">
            <MudTextField  @bind-Value="@xxxxx" Label="@item.PartsValue" Variant="Variant.Outlined" Margin="Margin.Dense"></MudTextField>
        </MudItem>
        i++;
    }
</MudGrid>

【问题讨论】：

我喜欢你每次开始一个新循环时创建一个int i=0，在循环结束时增加它然后扔掉它。 ;) 但无论如何：问题是什么？

标签： c# blazor blazor-webassembly

【解决方案1】：

我让你的代码工作并创建了一个小提琴，让你可以在线执行它：https://try.mudblazor.com/snippet/wYwFvcPUxSdgXHbW

<MudGrid>
   <MudItem xs="12" md="12">
        <MudSelect T="Part" MultiSelection="true" @bind-SelectedValues="options">
            @foreach (var part in parts)
            {
                <MudSelectItem T="Part" Value="@part">@part.PartValue</MudSelectItem>
            }
        </MudSelect>
    </MudItem>
    @foreach (var part in options)
    {
        <MudItem xs="3" sm="3" md="2">
            <MudTextField  @bind-Value="@part.PartValue" Label="Edit part" Variant="Variant.Outlined" Margin="Margin.Dense"></MudTextField>
        </MudItem>
    }
</MudGrid>

@code
{


    IEnumerable<Part> parts = new List<Part>()
    {
        new Part() {PartID = 1, PartValue = "Part 1"},
        new Part() {PartID = 2, PartValue = "Part 2"},
        new Part() {PartID = 3, PartValue = "Part 3"},
    };
    private IEnumerable<Part> options { get; set; } = new HashSet<Part>() { 
        new Part() {PartID = 3, PartValue = "Part 3"},
    };

    public class Part
    {
        public int PartID { get; set; }
        public string PartValue { get; set; }
        public override bool Equals(object o) {
            var other = o as Part;
            return other?.PartID==PartID;
        }
        public override int GetHashCode() => PartID.GetHashCode();        
        public override string ToString() {
            return PartValue;
        }
    }
}

【讨论】：