用淘汰赛js重新绑定json对象答案

【问题标题】：rebinding json object with knockout js用淘汰赛js重新绑定json对象
【发布时间】：2013-02-20 23:42:08
【问题描述】：

我正在使用 asplnet mvc 处理淘汰赛和 jquery。我使用来自控制器中返回的 json 对象的敲除来应用绑定。这适用于我的标记。

如果用户单击屏幕上的按钮，我会调用控制器操作并再次从服务器检索数据。

此时，我是否需要重新绑定我的新 json 对象以淘汰或如何处理？

【问题讨论】：

标签： asp.net-mvc knockout.js knockout-mapping-plugin

【解决方案1】：

我假设当用户单击按钮并调用控制器操作时，您将其作为 AJAX 回发而不是作为整页刷新来执行。如果这是正确的，那么不，您不需要重新绑定新的 json 对象。你只需要使用你的新 json 对象来更新你的视图模型，然后敲除会处理剩下的事情。其工作方式如下：

当您的页面最初加载时，您的页面会从您的控制器返回一个 javascript 对象。如果这个对象变成一个对应的对象，其中所有的属性都是敲除 observables 和 observableArrays，你可以在应用敲除绑定后获得持久的双向数据绑定（即从模型到你的页面和从页面到你的模型） .

将您的 javascript 对象转变为所有属性都是可淘汰的可观察对象的最简单方法是使用knockout mapping plugin。完成此操作后，您可以使用敲除 applybindings 方法将其绑定到您的页面。

所以在初始页面加载时，可以这样设置：

//load your data
var data = ... some code to retrieve your data
//convert this into a viewmodel having knockout observables as properties
MyPage.ViewModel = ko.mapping.fromJS(data);
//bind this viewmodel to all knockout bindings
ko.applyBindings(MyPage.ViewModel);

现在，当进行 AJAX 调用并检索新数据时，当您更新 ViewModel 时，knockout 将自动更新 UI：

//AJAX call is made
var newdata = ... results from AJAX call
//Update viewmodel
MyPage.ViewModel.Property1(newdata.Property1);
MyPage.ViewModel.Property2(newdata.Property2);
...other properties...
...UI is automatically updated by knockout

一旦 viewmodel 更新，UI 将自动刷新，这要归功于 knockout 的双向数据绑定。所以你只需要更新你的 viewmodel，knockout 就会自动应用它的绑定并负责更新 UI。

【讨论】：