jquery - 超过 KnockoutJS 最大调用堆栈大小

Question

我有这个代码：

self.EditItemPopup = function (something) {
    var temp = ko.mapping.toJS(something);
    //self.ItemToEdit = ko.mapping.fromJS(temp, EditItem, self.ItemToEdit);
    ko.mapping.fromJS(temp, EditItem,self.ItemToEdit);
    self.FindMatchingCategory(something.CategoryID());
    $("#editItemPopup").dialog("open");
};

self.FindMatchingCategory = function (categoryID) {
    ko.utils.arrayForEach(self.ViewModel().Categories(), function (categoryToFind) {
        if (categoryToFind.CategoryID() == categoryID) {
            self.ItemEditCategory(categoryToFind);
        }
    });
};

当 self.EditItemPopup 在一切正常时被调用，但是当它被第二次调用时我得到这个错误： Uncaught RangeError: Maximum call stack size exceeded

有人能告诉我问题出在哪里吗？

谢谢！

编辑：

EditItem 映射：

var EditItem = {
    ItemName: ko.validatedObservable().extend({
        required: {
            message: "Please enter an item name.",
            insertMessages: false
        }
    }),
    ItemCost: ko.validatedObservable().extend({
        required: {
            message: "Please enter a valid price.",
            insertMessages: false
        }
    }),
    CategoryID: ko.observable()
};

Answer 1

正如 Tomas 所提到的，您的映射看起来是错误的。这是一个潜在的解决方案。注意：我在这里做了一些假设，因为我看不到您的所有模型。

定义一个模型进行编辑：

function EditItemModel(data){
    var self = this;
    ko.mapping.fromJS(data, {}, self);

    self.ItemName.extend({
        required: {
            message: "Please enter an item name.",
            insertMessages: false
        }
    });

    self.ItemCost.extend({
        required: {
            message: "Please enter a valid price.",
            insertMessages: false
        }
    });
}

像这样修改 EditItemPopup 函数：

self.EditItemPopup = function (something) {
    var temp = ko.mapping.toJS(something);
    self.ItemToEdit(new EditItemModel(temp));
    self.FindMatchingCategory(something.CategoryID());
    $("#editItemPopup").dialog("open");
};

Answer 2

ko.mapping.fromJS 有签名：ko.mapping.fromJS(data, mappingOptions, viewModel);

但是，在您的情况下，第二个参数看起来不像映射选项。它看起来像视图模型。