如何通过ViewData将对象数组从控制器传递到视图并正确解析？

问题原因 #

Razor视图引擎会自动对输出内容进行HTML编码，导致你存在ViewData里的JSON字符串中的双引号被转义成"，最终输出到控制台的是转义后的字符串，而非可被JS识别的对象数组。

解决方案1：用Html.Raw()输出原始JSON #

直接在视图中用Html.Raw()包裹ViewData的值，绕过HTML编码，同时去掉外层单引号（因为输出的是合法JSON，可直接作为JS对象）：

<script>
console.log(@Html.Raw(ViewData["TableColumns"]));
</script>

执行后控制台会输出正常的对象数组：

[{"data":"id","name":"Id"},{"data":"code","name":"Code"}]

解决方案2：不在控制器序列化，交给视图处理 #

把匿名对象数组直接存入ViewData，在视图中使用ASP.NET Core内置的Json.Serialize()方法完成序列化，它会自动处理编码问题：

控制器代码修改： #

public async Task<IActionResult> IndexJson()
{
    var obj = new[] {
        new { data = "id", name = "Id" },
        new { data = "code", name = "Code" },
    };
    ViewData["TableColumns"] = obj;
    return View("IndexJson");
}

视图代码修改： #

<script>
console.log(@Json.Serialize(ViewData["TableColumns"]));
</script>

这种方法更贴合ASP.NET Core的开发习惯，无需手动处理JSON序列化的编码细节。

内容的提问来源于stack exchange，提问作者pikk