如何将 KnockoutJs observable 分配给另一个 observable？答案

【问题标题】：How to assign a KnockoutJs observable to another observable?如何将 KnockoutJs observable 分配给另一个 observable？
【发布时间】：2017-04-08 04:41:00
【问题描述】：

我有一个模型定义为：

var TestModel = function () {
    var self = this;

    self.Item = ko.mapping.fromJS(new Item());
    self.ItemList = ko.observableArray();
};

var Model = new TestModel();
ko.applyBindings(Model);

在 AJAX 调用之后，我用以下内容填充数组：

ko.mapping.fromJS(data, {}, Model.ItemList);

数组显示在屏幕上，当用户选择一个项目时，会打开一个模式对话框来编辑该项目。可以打开相同的模式对话框来添加新项目。该模态有一个data-bind="with: Item"，所以我可以这样做：

function add() {
    ko.mapping.fromJS(new Item(), {}, Model.Commission); //Empty object
    $('#dialog').dialog('open');
};

function saveAdd() {
    //Clone the properties...
    Model.ItemList.push(ko.mapping.fromJS(ko.mapping.toJS(Model.Item)));
}

function edit(i) {
    //Clone properties!
    ko.mapping.fromJS(ko.mapping.fromJS(ko.mapping.toJS(Model.ItemList()[i])), {}, Model.Item);
    $('#dialog').dialog('open');
}

function saveEdit(i) {
    //Clone properties!!!!
    Model.ItemList()[i] = ko.mapping.fromJS(ko.mapping.toJS(Model.Item));
}

每次我需要将一个可观察对象的值分配给另一个对象时，我都想避免克隆属性。我知道，如果我设法告诉 Knockout Model.Item 是 some Model.ItemList()[i]，对象引用应确保 UI 中的更改直接反映到我的 observableArray 项，但我不能只是评估它是Model.Item = Model.ItemList()[i];，因为这会破坏原始Model.Item 对象和视图[*1] 之间的绑定。

有没有办法将一个可观察对象分配给绑定到视图的另一个可观察对象，并维护引用？

如果不这样做，是更好的方法吗？基本上是一个页面，您将项目列表存储在 observableArray 中，然后在另一段 HTML 中添加/编辑。

编辑：[*1] 的解释

我找不到解释这个问题的 stackoverflow 问题，但它是这样的：

当我们执行ko.applyBindings(Model); 时，Model 内的可观察对象会绑定到视图。此时Model.Item 引用的对象已绑定，因此如果我执行Model.Item = Model.ItemList()[i];，Model.Item 引用的新对象不会绑定到任何东西。原始对象（在内存中）仍然是绑定到视图的对象，只是现在没有对它的引用。

【问题讨论】：

您能解释一下为什么“我不能将它分配为 Model.Item = Model.ItemList()[i]; 因为这会破坏原始 Model.Item 对象和视图之间的绑定”？
如果你让 Model.Item 成为一个 observable "self.Item = ko.observable(ko.mapping.fromJS(new Item()));"然后你可以更新它的内容，这不会改变绑定。 “Model.Item(Model.ItemList()[i])”。
@JasonSpake，就是这样。让它成为一个答案，我会接受它=）

标签： javascript knockout.js

【解决方案1】：

如果您使 Model.Item 成为可观察对象，其中包含映射对象，那么您可以将可观察对象的内容设置为新项目。敲除对 observable 的引用保持不变，因为您只是在更新内容而不是属性本身。

var TestModel = function () {
    var self = this;

    self.Item = ko.observable(ko.mapping.fromJS(new Item()));
    self.ItemList = ko.observableArray();
};

...
Model.Item(Model.ItemList()[i]);

【讨论】：