Question

我正在使用knockout js框架并使用映射插件来更新视图模型，其中包含之前保存的数据，如下面的小提琴所示。

HTML：

<a href="#" onclick="outputJson();">Click here for output Json</a>
<a href="#" onclick="reloadData();">Click here to load old data</a>
</br>
<input type="text" data-bind="value:firstName" />
<input type="text" data-bind="value:lastName" />
<span data-bind="text:fullName"></span>

使用Javascript：

     var updatedData = [];
            var viewModel = {
                myviewmodel: ko.observable().extend({noitfy:'always'})
            };
            function appViewModel() {
                var self = this;
                self.firstName = ko.observable('Bob');
                self.lastName = ko.observable('Smith');
                self.fullName = ko.computed(function () {
                    return self.firstName() + " " + self.lastName();
                });
            }
            viewModel.myviewmodel(new appViewModel());

            $(function () {
                ko.applyBindings(viewModel.myviewmodel);
            });
            function outputJson() {
               var unmapped = ko.mapping.toJS(viewModel.myviewmodel);
               updatedData.push(unmapped);
               viewModel.myviewmodel(new appViewModel());
            }
            function reloadData() {
                viewModel.myviewmodel(ko.mapping.fromJS(updatedData[0]));
            }

JS Fiddle

但每当我使用unmap选项时，使用ko.mapping插件的viewmodel计算的observable都不会更新。

情景是。 1.给出名字='Bob123'，姓氏='史密斯' 2.现在单击“单击此处输出Json”按钮，以便临时保存数据 3.单击“单击此处以加载旧数据”，现在我们可以获取旧数据firstname ='Bob123'，lastname ='Smith'，但是当我更改这些字段中的任何一个时，请先命名或最后不更新全名。

有人可以告诉我如何让计算字段在unmap上工作？

Answer 1

您遇到此问题的原因是您的视图模型绑定到可观察值的特定实例。 FirstName，LastName等。

因此，当您重新加载数据时，我建议进行以下更改：

viewModel.myviewmodel.firstName(updatedData[0].firstName);

viewModel.myviewmodel.firstName(updatedData[0].lastName);

这样，您就不会创建视图所绑定对象的新实例。

如果您正在从内存中删除对象，则绑定不再有效。

你可以再次为你的特定div清理节点和applyBindings，我还没有真正使用过。这将允许您将viewModel重新绑定到新数据。如果绑定发生变化，这将变得非常不灵活。

如果您有大量值要更新，我的最佳建议是使用javascript的关联数组属性，如下所示：

for (var prop in updatedData[0]) {
    viewModel.myviewmodel[prop](updatedData[0][prop]);
}

Knockout js映射插件无法正常工作

1 个答案: