Question

我的cshtml页面中有一个模型，我想将此模型转换为json对象，以便我可以在cshtml页面上的javascript中使用这个json。我正在使用MVC4。

我怎么能这样做？

Answer 1

<强> .NET Fiddle

您正在寻找的是“序列化”。 MVC 4默认使用Json.NET。语法非常易于使用。要在视图模型中访问库，请使用

using Newtonsoft.Json;

使用完毕后，序列化的语法如下：

string json = JsonConvert.SerializeObject(someObject);

序列化字符串后，您可以在视图中使用json：

var viewModel = @Html.Raw(json);

这是一个更深入的例子：

Model.cs

public class SampleViewModel : AsSerializeable
{
    public string Name { get; set; }
    public List<NestedData> NestedData { get; set; }
    public SampleViewModel()
    {
        this.Name = "Serialization Demo";
        this.NestedData = Enumerable.Range(0,10).Select(i => new NestedData(i)).ToList();   
    }
}

public class NestedData
{
    public int Id { get; set; }
    public NestedData(int id)
    {
        this.Id = id;   
    }
}

public abstract class AsSerializeable
{
    public string ToJson()
    {
        return JsonConvert.SerializeObject(this);
    }
}

Controller.cs

public class HomeController : Controller
{
    [HttpGet]
    public ActionResult Index()
    {
        return View(new SampleViewModel());
    }
}

View.cshtml

    <body>
    <div>
        <h1 id="Name"></h1>
        <div id="Data"></div>
    </div>
</body>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
    //Load serialized model
    var viewModel = @Html.Raw(Model.ToJson());

    //use view model
    $("#Name").text(viewModel.Name);

    var dataSection = $("#Data");
    $.each(viewModel.NestedData,function(){
        dataSection.append("<div>id: "+this.Id+"</div>");
    });
</script>

将MVC4模型转换为cshtml页面上的javascript json对象

1 个答案: