在初始页面加载时从服务器获取类对象并将其转换为js对象的好方法是什么?

本文关键字：对象 转换 js 是什么 方法 加载 获取 服务器 | 更新日期: 2023-09-27 18:03:08

目前，我在我的应用程序中做了这样的事情:

// Foo Controller
public ActionResult Details(int id)
{
    ViewBag.id = id;
    return View();
}
// Foo Details View
<script type="text/javascript">
    var viewBag = {
        'id': @ViewBag.id
    };// *Note: MVC will cry about a syntax error here, everything's ok though
</script>
<script type="text/javascript" src="@Url.Content("~/Views/Foo/details.js")"></script>
// details.js
$(function(){
    var jqXHR = $.ajax({
        'url': '/api/foo/getData/' + viewBag.id,
        'type': 'GET'
    });
    jqXHR.done(function(data){
        ...do stuff with data object...
    });
});
// Foo Api Controller
// Instantiates the data class object to be serialized and returned

我这样做是因为在<javascript>元素中，我不想让对象的一个巨大的JSON字符串挂在这里。理想情况下，我只想对Foo控制器进行一次调用，并使其实例化数据类对象，将其序列化为JSON字符串，并将其分配给ViewBag。数据模型或类似的东西。

当然我不能访问@ViewBag内。js文件，因为它是一个服务器端对象。有没有人知道一种更简洁的方法来做这件事，而不是让这种不必要的来回?

一个想法是解析参数的URL，但这可能会变得丑陋，这取决于路由结构，我仍然需要等待视图的初始get来获得js脚本来做所有这些，并且仍然最终不得不无论如何进行第二次调用。

我不知道它是否可能，但是否有一种方法，我可以动态地生成一个。js文件在视图创建期间，可以作为一个js ViewBag，将其添加到页面details.js文件加载之前，然后能够访问它的方式?或者可以动态修改details.js文件(如果需要最小化/捆绑，这可能不太理想)?

期望的结果是，我正在使用knockoutJS和我试图传递的初始对象是ViewModel，我想绑定到包含我想要使用的服务器的所有初始数据的页面。我从服务器获得的数据对象是ViewModel，我将其映射到一个可观察对象并绑定到DOM。我目前使用的方法似乎工作得很好，似乎没有太多的开销，但如果我能避免在页面初始加载时对服务器的第二次调用，那将是理想的。

在初始页面加载时从服务器获取类对象并将其转换为js对象的好方法是什么?

首先，我不会将动态信息写入脚本标记。而是将数据编码为JSON，然后将其写入隐藏字段。

当您使用MVC4时，您将已经有对JSON的引用。所以你应该可以这样做:

控制器 

public ActionResult Details(int id)
{
    var myModel = GetMyModelData(id);
    string modelJson = JsonConvert.SerializeObject(product); 
    return View(modelJson);
}

在视图中

<input type="hidden" id="model" value="@Model" />
在Javascript 

var modelJson = $('#model').val();
var modelObj = JSON.parse(modelJson);
相关文章：