根据来自服务器的初始标记填充 knockoutJS 视图模型对象答案

【问题标题】：Populate knockoutJS view model object based on an initial markup from the server根据来自服务器的初始标记填充 knockoutJS 视图模型对象
【发布时间】：2012-07-15 20:33:25
【问题描述】：

我的网络服务器返回一个带有一些结构化标记的页面。我需要使用 knockoutJS 将标记表示形式作为 JSON 对象 - 淘汰视图模型对象。

页面基本上（在初始加载后）有一个<div data-bind="foreach: ExistingNamings">，它有几个封闭的 div，实际上包含应该进入视图模型对象的 ExistingNamings 数组的内容。

能否根据调用ko.applyBindings时提供的标记剔除“解析”和现有标记并填充视图模型？

关于 KNJS 的教程显示了相反的情况 - 我们在 JS 中有一个数据生成代码，它在调用 applyBindings 时被推送到一个 html 中。

附：我的服务器端是 ASP.NET MVC，我看到有人建议 http://knockoutmvc.com/ - 一种为 js 文件生成初始化代码的方法。这样，它“好像”视图模型是通过 javascript 初始化的。这是处理初始数据的唯一方法，还是我确实可以解析标记？

【问题讨论】：

请不要使用knockoutmvc。它是 Web 表单的邪恶混蛋后代，将每个方法调用推到服务器上，并将客户端视图模型的快速性能拖入回发延迟的黑暗沼泽。这是邪恶的。
另外，我不完全确定我理解。您的服务器以 html 格式发送数据？为什么不使用 razer 从模型中序列化它？
Tyrsius - 你的意思是在 razor 中创建 json onbject 并在 js 中使用它来初始化视图模型？那是可以的。如果可能，请在答案中展示一个简单的示例，我们很好。

标签： javascript asp.net-mvc razor knockout.js

【解决方案1】：

您可以像这样使用 razor 将 C# 模型直接序列化为 JSON：

var serverModel = @Html.Raw(Json.Encode(Model));

或者，显然：

var serverProperty = @Html.Raw(Json.Encode(Model.Property));

唯一失败的情况是当您有循环引用时，如果您将实体模型直接放入其中，就会发生这种情况。如果您这样做，请为它们创建一个 ViewModel，以消除循环导航属性。

更新：

要将其添加到您的 viewModel 中，请将其添加到 Razor 视图的底部：

<script type="text/javascript">
    var serverModel = @Html.Raw(Json.Encode(Model));    
    //Define KO viewModel, either here, or by including via script tag in header    
    ko.applyBinding(new ViewModel(serverModel));
</script>

【讨论】：

谢谢，我知道。如何将其链接到客户端上的淘汰视图模型？仅通过ajax调用？ :)