在 Knockout 中保存原始值答案

【问题标题】：Save original values in Knockout在 Knockout 中保存原始值
【发布时间】：2026-02-17 06:00:01
【问题描述】：

我从 JSON（从我的服务器）将数据读入我的视图模型。

我的用户从一些输入字段更改了视图模型，但我需要能够撤消它并从我的原始 JSON 中恢复原始值。

是否可以在视图模型上存储“属性” - 类似于原始值的属性？这样我可以读回来吗？

谢谢

更新...

尝试制作一个 jsfiddle（这显然行不通）来展示我想做的事情：

var ViewModel = function(first, last) {
    this.firstName = ko.observable(first);
    this.lastName = ko.observable(last);
};

ViewModel.firstName.attribute("fieldtype", "string");
ViewModel.firstName.attribute("fieldlength", "30");
ViewModel.firstName.attribute("org-value", "Jane");

ko.applyBindings(new ViewModel("John", "Doe")); 

$("#cmd").clicked(function() {
    ViewModel.firstName(ViewModel.firstName.attribute("org-value"));
});

http://jsfiddle.net/MojoDK/kaymX/

【问题讨论】：

你的模特是什么样的？显示一些代码。你已经尝试过什么？这应该就像存储来自服务器的 JSON 响应一样简单，以便您以后可以在需要时恢复它。
我更新了我的问题。

标签： javascript jquery model-view-controller knockout.js

【解决方案1】：

我喜欢通过向可观察对象添加属性来将“属性”附加到它（毕竟它只是一个 JavaScript 函数）。每个属性都附加到它所属的 observable 上，而不是存储在其他地方的另一个结构中。另一个好处是，如果您在视图模型上调用 ko.toJSON()，则可观察对象上的属性也不会被序列化。

function VM (value) {
  var self = this;

  self.foo = ko.observable(value);
  self.foo.original = value;

  self.revert = function () {
    self.foo(self.foo.original);
  };
}

JsBin：http://jsbin.com/biguvoqe/1/edit?html,js,output

【讨论】：

啊，好酷……没想到。这看起来是一个完美的解决方案。谢谢

【解决方案2】：

调整您放入小提琴的内容，您可以执行以下操作：

http://jsfiddle.net/kaymX/2/

var ViewModel = function(first, last) {
    this.firstName = ko.observable(first);
    this.lastName = ko.observable(last);
    this.firstName.attributes = {};
};

var myVM = new ViewModel("John", "Doe");

myVM.firstName.attributes["fieldtype"] = "string";
myVM.firstName.attributes["fieldlength"] = "30";
myVM.firstName.attributes["org-value"] = "Jane";

ko.applyBindings(myVM); 

$("#cmd").click(function() {
    myVM.firstName(myVM.firstName.attributes["org-value"]);
});

虽然在视图模型的构造函数中移动属性设置可能更容易。您也可以使用点表示法而不是方括号表示法，但我将其保留为通过字符串访问属性，因为我假设您首先有理由使用它。

【讨论】：