在 viewmodel 构造函数中使用 Knockoutjs 映射插件答案

【问题标题】：Using Knockoutjs Mapping Plugin inside viewmodel constructor在 viewmodel 构造函数中使用 Knockoutjs 映射插件
【发布时间】：2015-08-25 15:17:06
【问题描述】：

我正在尝试在构造函数中使用映射插件，这样我就可以轻松地将其他函数添加到构造函数，并从映射插件自动创建可观察项。这是我目前拥有的代码，但它既没有映射我提供的可观察变量，也没有在最终视图模型中包含“保存”功能。有没有更好的方法来做到这一点？

function ViewModel(model){
        var self = this;

        self = ko.mapping.fromJS(model);

        self.save = function() {
            var data = ko.toJSON(self);
            $.post("/Licensing/edit", data, function(returnedData) {
                // This callback is executed if the post was successful
            });
        }

    };

    var vm = new ViewModel(model);
    ko.applyBindings(vm);

【问题讨论】：

标签： javascript knockout.js knockout-mapping-plugin

【解决方案1】：

您的代码不起作用，因为 ko.mapping.fromJS(model); 返回一个新对象，您分配给您的 self 局部变量您使用 save 函数扩展的内容。

但是，这个新对象不会从您的构造函数返回，因此您将以一个空对象结束，因为最初传入的 this 没有被修改。

您可以通过从构造函数返回 self 来解决此问题：

function ViewModel(model){
    var self = this;

    self = ko.mapping.fromJS(model);

    self.save = function() {
        var data = ko.toJSON(self);
        $.post("/Licensing/edit", data, function(returnedData) {
            // This callback is executed if the post was successful
        });
    }

    return self;
};

或者您可以告诉映射插件不要创建新对象，只需使用当前创建的对象并将self 作为第三个参数传递：

function ViewModel(model){
    var self = this;

    ko.mapping.fromJS(model, {}, self);

    self.save = function() {
        var data = ko.toJSON(self);
        $.post("/Licensing/edit", data, function(returnedData) {
            // This callback is executed if the post was successful
        });
    }

};

【讨论】：

我知道这是小事，感谢您的帮助。

【解决方案2】：

没有理由使用构造函数（使用new）。您不会制作多个实例或拥有原型。只需使用 ko.mapping 为您创建的对象。

function ViewModel(model){
    var self = ko.mapping.fromJS(model);

    self.save = function() {
        var data = ko.toJSON(self);
        $.post("/Licensing/edit", data, function(returnedData) {
            // This callback is executed if the post was successful
        });
    }
    return self;
};

var vm = ViewModel(model);
ko.applyBindings(vm);

【讨论】：

【解决方案3】：

save也是私有方法，save这样写：

self._save = function() { }

【讨论】：