修改 MOVIE 列表 MVC 教程 - 添加新的局部视图

Question

我正在按照本教程学习基本的 MVC Movie List Tutorial in MVC 我在教程的末尾。现在我想对本教程进行自己的修改。首先，我想向这个电影列表视图添加一个新的局部视图。所以在一个DIV中，我把下面的代码放在已经渲染了电影列表的索引页中。

 @{Html.RenderPartial("_NewPartialView");}

为此，首先在 Models 文件夹中，我为 NewClass.cs 创建了一个新模型类。模型文件夹已经有一个电影模型 Class.Movie.cs 问题 1：我应该为新的局部视图创建一个单独的 Model .cs 文件还是应该在同一个 Movie.cs 文件中创建其他类？

然后我使用基于新模型的脚手架创建了一个局部视图（现在我将新模型放在一个单独的 .cs 文件中 - 这意味着我现在有两个模型，一个用于电影，一个用于 NewModel（用于局部视图）。我希望这个在原始电影列表索引页面中呈现为侧面的部分视图。

我有一个包含代码的 MoviesController

 public ViewResult Index()
    {
        return View(db.Movies.ToList());
    }

我还有什么遗漏吗？如果我尝试运行它，它会在代码行中断

 @{Html.RenderPartial("_NewPartialView");}

此时我收到的错误消息是“传入字典的模型项的类型为 System.Collections.Generic.List1[Project.Models.Movie]', but this dictionary requires a model item of type 'System.Collections.Generic.IEnumerable1[Project.Models.NewModel]”。

在将基于新模型的新局部视图添加到现有视图/模型的这一步中，我需要一些 MVC 专家指导。我需要帮助并感谢任何有助于我学习的信息。谢谢

Answer 1

查看您的错误消息，您的视图期望 IEnumerable 包含 Project.Models.NewModel 的类，而您传递的 List 包含 Project.Models.Movie 的类。基本上，您传递的视图数据并非旨在处理。您可以更改顶部的视图/部分内容，例如：

@model List<Project.Models.Movie>

这会使您的视图期望一个 moives 列表，这就是您在示例中从控制器传递视图的内容。附注

@model IEnumerable<Project.Models.Movie>

可以和从 IEnumerable 继承的 List 一样工作。

如果您希望视图接受IEnumerable<Project.Models.NewModel>，那么您需要将控制器修改为：（我在这里对您的模型属性做出假设）

public ViewResult Index()
{
    return View(db.Movies.Select(m => new NewModel { Title = m.Title, Director = m.Director}));
}

这会将IEnumerable<Project.Models.NewModel> 传递给您的视图。

另一方面，在 razor 中引用部分的更简单方法是：

@Html.Partial("_NewPartialView")

更新

您需要为自己创建一个ViewModel，所以它看起来像这样：

public class IndexViewModel
{
  public List<Movie> Movies {get; set;}
  public List<NewModel> NewModels {get; set;}
}

public ViewResult Index()
{
    var viewModel = new IndexViewModel
    {
      Movies = db.Movies.ToList(),
      NewModels = new List<NewModel>() // Or however you populate it
    };

    return View(viewModel );
}

那么在你看来，你的电影会是这样的

@foreach (var moive in Model.Movies) { }

你的新模型部分将是

@Html.Partial("_NewPartialView", Model.NewModels)

请注意，您需要更新索引页面顶部的模型以引用 IndexViewModel。