asp.net-mvc - 如何将列表添加到 View 模型 MVC

Question

我将 MVC 3 与 View 模型一起使用，在我的例子中，我有一个 View 模型，它应该显示一个项目列表以及一个用于插入一些输入的表单。

我的 View 有问题，因为我无法将用于插入数据的表单与 View 模型相关联，你能告诉我我做错了什么吗？

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel.DataAnnotations;
using TestGuestBook.Models;

namespace TestGuestBook.ViewModel
{
    public class ListAddCommentsViewModel
    {
        public int CommentId { get; set; }

        [Required]
        public string Nominative { get; set; }

        [Email]
        public string Email { get; set; }

        [Required]
        public string Content { get; set; }

        public List<Comment> CommentItems { get; set; }
    }
}

查看

@model IEnumerable<TestGuestBook.ViewModel.ListAddCommentsViewModel>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>ListAddCommentsViewModel</legend>

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

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

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

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

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

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table>
    <tr>
        <th>
            CommentId
        </th>
        <th>
            Nominative
        </th>
        <th>
            Email
        </th>
        <th>
            Content
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.CommentId)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Nominative)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Email)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Content)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
            @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
            @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
        </td>
    </tr>
}

</table>

Answer 1

您不需要将 Collection 传递给您的 View 。只有一个 ViewModel 对象就足够了。您的 ViewModel 已经拥有用于保存集合的属性(评论列表)

因此在您的GET 操作中，仅将此 viewModel 的一个实例返回给 View

public ActionResult GetComments(int postId)
{
  var viewModel=new ListAddCommentsViewModel();
  viewModel.CommentItems =db.GetComments(postId);
  return View(viewModel);
}

现在在您的 View 中，让它绑定(bind)到 ListAddCommentsViewModel

的单个实例

@model TestGuestBook.ViewModel.ListAddCommentsViewModel

在您的 View 中，要显示您的评论列表，请在您的 ViewModel

中使用集合类型属性 ( Model.CommentItems)

@foreach (var item in Model.CommentItems) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.CommentId)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Nominative)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Email)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Content)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new {  @id=item.PrimaryKey  }) |
            @Html.ActionLink("Details", "Details", new {  @id=item.PrimaryKey  }) |
            @Html.ActionLink("Delete", "Delete", new { @id=item.PrimaryKey  })
        </td>
    </tr>
}