c# - 在 MVC 中动态添加 ICollection 项到模型中 "creating"

Question

找到了一个解决方案，但是一个非常难看的解决方案，请参见底部，有人可以改进该解决方案吗？

所以我有一个像这样的虚拟模型

public class TestModel
{
    public int TestModelID { get; set; }
    public string Name { get; set; }
}

还有一个像这样的

public class Collector
{
    public int CollectorID { get; set; }
    public string CollectorString { get; set; }
    public ICollection<TestModel> MyList { get; set; }
}

我想(以简单的 CRUD 风格)创建一个新对象Collector并填充(稍后动态添加新字段，目前只有一个)ICollection。 这是我的看法

@model TestApplication.Models.Collector

@{
    ViewBag.Title = "Create";
}

<h2>Create</h2>


@using (Html.BeginForm()) 
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Collector</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.CollectorString, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CollectorString, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.CollectorString, "", new { @class = "text-danger" })
            </div>
        </div>


        <div class="form-group">
            @Html.LabelFor(model => Model.MyList.ToList()[0].Name)
            <div class="col-md-10">
                @Html.EditorFor(model => model.MyList.ToList()[0].Name, new { htmlAttributes = new { @class = "form-control" } })


            </div>
        </div>
        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

和 Controller

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(Collector collector)
{
    if (ModelState.IsValid)
    {
        db.Collectors.Add(collector);
        db.SaveChanges();
        return RedirectToAction("Index");
    }

    return View(collector);
}

这是生成的 HTML 代码(我希望只有相关部分)

<div class="form-group">
    <label for="">Name</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" name="[0].Name" type="text" value="" />
    </div>
</div>

但是创建时 Controller 中的MyList始终为null，为什么？ (是的，我知道 Haackeds 博客条目，但仍然不明白为什么它不起作用)

所以问题是，这一行

@Html.EditorFor(model => model.MyList.ToList()[0].Name, new { htmlAttributes = new { @class = "form-control" } })

虽然非常推荐在 MVC 中使用，但在这里生成它

<input class="form-control text-box single-line" name="[0].Name" type="text" value="" />

这显然不起作用。如何让 razor 将 [0].Name 更改为 MyList[0].Name？

**更新:** 所以我找到了一个解决方案，如果在这里进行硬编码

<input class="form-control text-box single-line" name="MyList[0].Name" type="text" value="" />

Controller 理解它，但我没有得到null。如何使用 Razor 解决这个问题？

Answer 1

ICollection<T>没有索引器。 IList<T>确实

public class Collector {
    public Collector() {
        MyList = new List<TestModel>(); 
    }
    public int CollectorID { get; set; }
    public string CollectorString { get; set; }
    public IList<TestModel> MyList { get; set; }
}

这将允许

@Html.EditorFor(model => model.MyList[0].Name, new { htmlAttributes = new { @class = "form-control" } })

在 View 中生成所需的标记

<input class="form-control text-box single-line" name="MyList[0].Name" type="text" value="" />

也可以在多个项目的循环中使用

<div class="form-group">
@for(int i = 0; i < Model.MyList.Count; i++) {
    @Html.LabelFor(model => Model.MyList[i].Name, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.EditorFor(model => model.MyList.ToList()[i].Name, new { htmlAttributes = new { @class = "form-control" } })
    </div>
}
</div>

当从 Controller 的初始调用返回模型时，只需确保对模型集合索引的调用有一个项目。

[HttpGet]
public ActionResult Create() {
    var model = new Collector();
    model.MyList.Add(new TestModel());
    return View(model);
}