knockout.js - 如何在模态对话框中处理编辑剔除 ViewModel

Question

我正在使用 knockout.js 构建一个向导式界面，其中最后阶段允许用户查看他们输入的信息。有一些链接可以打开一个模式对话框，可以在其中编辑部分信息。

我将如何处理我的淘汰视图模型的更新，以便主视图模型对象仅在对话框被“接受”时更新？笔记; 如果用户取消对话框，原来的 ViewModel 应该保持不变。

Answer 1

如果您只是在寻找通用解决方案，那么它非常简单。

//main Viewmodel

self.openDialog = function() {
    var copy = //copy wizard with preferred method
    self.dialogItem(copy);
    self.isShowingDialog(true); 
};

self.acceptDialog = function() {
    self.isShowingDialog(false);
    var result = //copy self.dialogItem with preferred method
    self.wizard(result);
};

更新

我更喜欢使用 Knockouts 超级超级棒的复制功能：ko.toJS(viewmodel). 它通过展开所有可观察对象来制作对象的副本，因此您拥有一个普通对象。如果你的构造函数接受一个对象作为参数，那么你可以使用这个对象来构建一个新的副本。它可能看起来像这样

var Wizard = function(data) {
    var self = this;
    self.id = ko.observable(data.id || 0);
    self.name = ko.observable(data.name || '');
    self.otherThing = ko.observable(data.otherThing || '');
};

...

var copy = new Wizard(ko.toJS(original));

现在你有了一个可靠的副本。