在视图模型构造函数中使用 Knockoutjs 映射插件

Question

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

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);

Answer 1

您的代码无法正常工作，因为 ko.mapping.fromJS(model); returns 您分配给 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
        });
    }

};

Answer 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);

Answer 3

另外save是私有方法，这样写save :

self._save = function() { }

在视图模型构造函数中使用 Knockoutjs 映射插件

Using Knockoutjs Mapping Plugin inside viewmodel constructor

javascript

knockout-mapping-plugin

knockout.js