将 ActionResult 和 PartialView IEnumerable 结果转换为返回 json 对象

Question

将基本的ActionResult 转换为JSON 对象并将它们呈现在PartialView 中时，最好的方法是什么？我的目标是修改应用程序，以便在页面请求时仅将 db 中的 cmets 页面呈现到一种数据服务类型，该服务更新PartialView 以添加任何可能已经发布的传入 cmets最后一页请求。我认为我正在寻找的解决方案将以json 格式使用OData，然后使用knockout.js 绑定该数据，但不确定。

这里是控制器ActionResult，它将一个IEnumerable对象列表从存储库返回到PartialView：

        [ChildActionOnly]
        public ActionResult GetCommentsById(int AId = 0)
        {

            if (AId == 0)
                return HttpNotFound();

            return PartialView("_CommentsPartial",  
            _unitOfWork.ArticleRepository.GetCommentsByArticleId(AId));
        }

这是PartialView 的sn-p 以保持简短：

@model IEnumerable<BlogSite.Models.Comment>
@using BlogSite.Helpers;

<ul id="comments-list">

    @{

        foreach (var comment in Model)
        {
            <!--Grabs Parent Comment and then all replies w/ParentCommentId b4 grabs new Parent Comment -->
            if (comment.isRoot && comment.ParentCommentId == null)
            {
                <!-- Comment -->
                int counter = 0; foreach (var c in Model) { if (c.ParentCommentId == comment.CommentId) { counter += 1; } }
                <li id="@comment.CommentId" itemscope itemtype="http://schema.org/UserComments" class="comment-container" tabindex="@comment.CommentId">

然后我从详细信息视图中调用它：

<div id="comments-panel" class="panel-box">

    <div class="show-comments"><div id="upNdown"></div><span id="showNhide">Show Comments</span></div><br />  <br />

    <div id="comments-partial" style="display:none;">
        @Html.Action("AddComment", "Comment", new { AId = Model.ArticleId })
        @Html.Action("GetCommentsById", "Article", new { AId = Model.ArticleId })
    </div>

</div>

我怎样才能使这种转换尽可能轻松？提前致谢！

Answer 1

我想我从您的问题中了解到，控制器已经完成了它的工作，您只是想“使用”它的数据输出，就好像它是使用相同 js 代码的 AJAX 请求一样。只需使用Newtonsoft Json.NET api 和Forloop.HtmlHelpers 提供的扩展来序列化模型中的数据，您就可以相当容易地做到这一点。如果您还没有，可以将它们安装为 nuget 包。

首先，您可以将其放在局部视图中
注意：如果您不想安装 Newtonsoft 软件包，您可以将 JsonConvert.SerializeObject 替换为 System.Web .Helpers方法 Json.Encode

@{
    using (var context = Html.BeginScriptContext())
    {
        Html.AddScriptBlock("var jsonData=" + JsonConvert.SerializeObject(Model) + ";");
    }
}

然后在您的布局页面中，为确保您的脚本块在适当的时间呈现，将此调用添加到Html.RenderScripts

@Scripts.Render("~/bundles/jquery")
@*Add any other dependency scripts*@

@Html.RenderScripts()

@RenderSection("scripts", required: false)

这就是您需要 Forloop.HtmlHelpers 包的原因，这些扩展方法有助于缓解在 jQuery 或其他任何东西启动之前在局部视图中呈现的乱序脚本代码。

希望有帮助