侧边栏中带有标题列表的新闻页面答案

【问题标题】：News page with headline list in sidebar侧边栏中带有标题列表的新闻页面
【发布时间】：2019-05-25 16:52:10
【问题描述】：

我对 MVC 很陌生。我正在尝试创建一个页面，其中从 SQL Server 数据库中提取新闻故事以填充页面的主要区域，同时我有一个侧边栏，其中列出了所有标题。我尝试使用侧边栏的局部视图。

这是来自控制器的代码，用于填充视图：

        public ActionResult _ArticleList()
        {
            return View(db.Articles.OrderByDescending(a => a.id).ToList());
        }    

        public ActionResult Details(int? id)
        {
            if (id == null)
            {
                return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
            }
            Articles articles = db.Articles.Find(id);
            if (articles == null)
            {
                return HttpNotFound();
            }
            return View(articles);

我的主视图 - Details.cshtml

@model MyApplication.Models.Articles

    <div id="container">

        {
        <div id="main" class="col-md-9">

            <h2> @Html.DisplayFor(model => model.Headline)</h2>
            <p style="white-space:pre-line">
                @Html.DisplayFor(model => model.Content)
            </p>
        </div>
        <div id="rightnav" class="col-md-3">
            @Html.Partial("_ArticleList")

        </div>
    </div>

和我的部分观点 - _ArticleList.cshtml

@model IEnumerable<MyApplication.Models.Articles>

@foreach (var item in Model)
{
    <a href="/Details/@item.id"> @Html.DisplayFor(modelItem => item.Headline)</a>
    <br>
}

我在主视图中的 @model MyApplication.Models.Articles 和部分视图中的 @model IEnumerable<MyApplication.Models.Articles> 之间遇到冲突。

任何人都可以提出解决这个问题的方法吗？

【问题讨论】：

标签： c# asp.net-mvc razor asp.net-mvc-5

【解决方案1】：

@Html.Partial("_ArticleList")
// and
@{Html.RenderPartial("_ArticleList");}

意味着，加载 CSHTML 页面并将其与当前模型一起放在这里（渲染版本更有效）。它们是无控制器的，这意味着没有对控制器的调用。

如果您需要在单独的控制器/方法上下文中加载 HTML，则可以使用以下方法之一。

@Html.Action("_ArticleList")
// and
@{Html.RenderAction("_ArticleList");}

同样，使用Render Option is more performant。

您可能遇到的问题是，Action/Render 都将使用您拥有的任何布局进行渲染，从而导致非常奇怪的输出（可能是以前的 body 标记中的 html 标记）。为了防止这种情况发生，您可以在控制器中调用PartialView()，而不是调用View()。

public ActionResult _ArticleList()
{
  return PartialView(db.Articles.OrderByDescending(a => a.id).ToList());
}

我还建议您锁定此方法，以便它只能由Action() 或RenderAction() 使用ChildActionOnlyAttribute 调用。

[ChildActionOnly]
public ActionResult _ArticleList()
{
  return PartialView(db.Articles.OrderByDescending(a => a.id).ToList());
}

【讨论】：

非常感谢。 Html.RenderAction 让我通过了 YSOD，但正如您所预测的那样，它确实弄乱了我的 Bootstrap 布局。 return PartialView 解决了这个问题。

【解决方案2】：

将@Html.Partial("_ArticleList") 替换为@Html.Action("_ArticleList", "Articles")，这将运行到您的文章控制器并且应该使用您创建的部分视图。

【讨论】：