Asp.net mvc 4 MVC“；“创建视图”；当模型中存在一对多关系时

我的模型很简单，一个客户可以有多个电话号码：

我在实体框架中表示了这一点

生成的客户端类如下所示

public partial class Client
{
    public Client()
    {
        this.PhoneNumbers = new HashSet<PhoneNumber>();
    }

    public int Id { get; set; }
    public string Name { get; set; }

    public virtual ICollection<PhoneNumber> PhoneNumbers { get; set; }
}

公共部分类客户端
{
公共客户机（）
{
this.PhoneNumbers=新HashSet（）；
}
公共int Id{get；set；}
公共字符串名称{get；set；}
公共虚拟ICollection电话号码{get；set；}
}

现在我需要为“创建客户端”创建一个视图页面。此页面还应有空间输入电话号码（例如：默认情况下，应有两个文本框输入电话号码）

客户
@LabelFor（model=>model.Name）
@EditorFor（model=>model.Name）
@Html.ValidationMessageFor（model=>model.Name）

正如上面的“创建视图”一样，我们可以很容易地为“model.Name”提供一个空间，因为它是一个简单的属性。但是我怎样才能做类似的事情来收集电话号码呢

---

我知道我们可以通过难看的javascript代码实现这一点，但我想知道我们可以通过ASP.NET MVC使用的最简单、最简单的方法

你必须做几件事：

首先创建一个具有所需属性的

ViewModel

：

public class ClientViewModel
{
   public int Id {get;set;}
   public string Name {get;set;}
   public PhoneNumber PhoneNumber1 {get;set;}
   public PhoneNumber PhoneNumber2 {get;set;}
}

更改

Create

以返回

ClientViewModel

[HttpGet]
public ActionResult Create()
{
   return View(new ClientViewModel());
}

映射

HttpPost

以使用

ClientViewModel

并将值映射到它：

[HttpPost]
public ActionResult Create(ClientViewModel clientViewModel)
{
   var client = new Client();
   client.Name = clientViewModel.Name;
   client.PhoneNumbers.Add(clientViewModel.PhoneNumber1);
   client.PhoneNumbers.Add(clientViewModel.PhoneNumber2);
   db.Clients.Add(client);
   db.SaveChanges();
   return RedirectToAction("Index", "Client");
}

然后，最后，修改您的视图：

<fieldset>
   <legend>Client</legend>

   <div class="editor-label">
      @Html.LabelFor(model => model.Name)
   </div>
   <div class="editor-field">
      @Html.EditorFor(model => model.Name)
      @Html.ValidationMessageFor(model => model.Name)
   </div>

   <div class="editor-label">
      @Html.LabelFor(model => model.PhoneNumber1.Number)
   </div>
   <div class="editor-field">
      @Html.EditorFor(model => model.PhoneNumber1.Number)
      @Html.ValidationMessageFor(model => model.PhoneNumber1.Number)
   </div>

   <div class="editor-label">
      @Html.LabelFor(model => model.PhoneNumber2.Number)
   </div>
   <div class="editor-field">
      @Html.EditorFor(model => model.PhoneNumber2.Number)
      @Html.ValidationMessageFor(model => model.PhoneNumber2.Number)
   </div>

   <p>
      <input type="submit" value="Create" />
   </p>
</fieldset>

客户
@LabelFor（model=>model.Name）
@EditorFor（model=>model.Name）
@Html.ValidationMessageFor（model=>model.Name）
@LabelFor（model=>model.PhoneNumber1.Number）
@EditorFor（model=>model.PhoneNumber1.Number）
@Html.ValidationMessageFor（model=>model.PhoneNumber1.Number）
@LabelFor（model=>model.PhoneNumber2.Number）
@EditorFor（model=>model.PhoneNumber2.Number）
@Html.ValidationMessageFor（model=>model.PhoneNumber2.Number）

对于该系列，您可以使用以下内容：

@for(int i = 0; i < Model.PhoneNumbers.Count; i++)
{
   <div class="editor-field">
        @Html.EditorFor(model => model.PhoneNumbers[i])
        @Html.ValidationMessageFor(model => model.PhoneNumbers[i])
    </div>
}

@for（int i=0；imodel.PhoneNumbers[i]）
@Html.ValidationMessageFor（model=>model.PhoneNumbers[i]）
}

此解决方案为我提供了一种更好的方法。直到现在我才知道“视图模型”。非常感谢您提出此解决方案。如果电话号码不受限制怎么办？@chris您可以为1个电话号码创建一个视图模型，然后为其创建一个编辑器模板。然后，可能使用一些js将编辑器模板动态添加到页面，并将集合发布到控制器。假设您使用客户端作为ViewModel，很遗憾，您无法使用ICollection实现这一点。是的，您是对的，在这种情况下，OP需要客户端VM的另一个视图，以使其与EditorFor正常工作

@for(int i = 0; i < Model.PhoneNumbers.Count; i++)
{
   <div class="editor-field">
        @Html.EditorFor(model => model.PhoneNumbers[i])
        @Html.ValidationMessageFor(model => model.PhoneNumbers[i])
    </div>
}