Javascript 如何在不使用映射的情况下更新ViewModel

我有一个淘汰的ViewModel，它有一些可观察的，一些可观察的数组有可观察的

var FulfillRequistionRequestModel = function (data) {
    data = data || {}; var self = {};

    self.RequisitionId = ko.observable(data.RequisitionId || null);
    self.FulfillItemList    = ko.observableArray(
        ko.utils.arrayMap(data.FulfillItemList, function (item_list) { return new FulfillItemModel(item_list); })
    );
    self.NumberOfItems = ko.computed(function () { return self.FulfillItemList().length; });

    //add-remove FullfillItem in FulfillItemList (this is per line number)
    self.removeItemFromList = function (fulfill_item) { self.FulfillItemList.remove(fulfill_item); };
    self.addItemToList = function () { self.FulfillItemList.push(new FulfillItemModel()); };

    return self;
};

var FulfillItemModel = function (data) {
    data = data || {}; var self = {};

    self.BoxNumber      = ko.observable(data.BoxNumber                  || null);
    self.LineNumber     = ko.observable(data.LineNumber                 || null);
    self.SourceBin      = ko.observable(new BinModel(data.SourceBin)    || null);
    self.ItemDetailList = ko.observableArray(
        ko.utils.arrayMap(data.ItemDetailList, function (item_list) { return new ItemDetailModel(item_list); })
    );
    self.NumberOfItems = ko.computed(function () {return self.ItemDetailList().length;});

    //add-remove something from ItemDetailList (ItemDetail)
    self.removeItemFromList = function (item) { self.ItemDetailList.remove(item); };
    self.addItemToList = function () { self.ItemDetailList.push(new ItemDetailModel()); };

    return self;
};
var ItemDetailModel = function(data) {
    data = data || {}; var self = {};

    self.Part           = ko.observable(data.Part           || null);
    self.Owner          = ko.observable(data.Owner          || null);
    self.Condition      = ko.observable(data.Condition      || null);
    self.Bcn            = ko.observable(data.Bcn            || null);
    self.SerialNumber   = ko.observable(data.SerialNumber   || null);
    self.Quantity       = ko.observable(data.Quantity       || null);

    return self;
};

var myModel = new FulfillRequistionRequestModel(thing);
ko.applyBindings(myModel);

你明白了。我有一个ViewModel，它有几个可观察的对象，然后是一个由一组可观察的对象组成的可观察的数组（ItemModel）

下面是它使用的JSON示例：

var thing = {
    RequisitionId: 55,
    FulfillItemList: [
        {
            BoxNumber: 555,
            LineNumber: 001,
            SourceBin: { Location: "Jason", Warehouse: "AMERICA" },
            ItemDetailList: [
                { Part: "999-JASONTEST-111", Condition: "OLD" },
                { Part: "999-JASONTEST-115", Quantity: 55 }
            ]

        },
        {
            BoxNumber: 444,
            LineNumber: 002,
            SourceBin: { Location: "Jason", Warehouse: "CANADA" },
            ItemDetailList: [
                { Part: "999-JASONTEST-221", Condition: "NEW" },
                { Part: "999-JASONTEST-225", Bcn: "ABC123", Condition:"BUSTED", Quantity: 23 },
                { Part: "999-JASONTEST-228", Quantity: 55 }
            ]

        }
    ]
};

把这想象成一个“命令”。有人单击订单ID，它将加载相关信息。我需要它，这样，如果他们单击另一个订单ID，视图模型就会用该信息更新（来自AJAX调用的新JSON）

无处不在我明白了，使用

ko.mapping.fromJS（newJSON，mapping，viewModel）格式--但我咬紧牙关，没有用ko.mapping映射我的ViewModel。这次，我花时间构建它，这样我才能真正锻炼它的肌肉，而ko.mapping在我手工构建的MVVM上似乎不起作用

那么-假设我获得了一个新的顶级数据-我如何刷新
myModel
，使其正常工作

我甚至尝试过设置
myModel={}
或
myModel=newfulfillrequisitionrequestmodel（{}）
只是想看看是否可以将元素/页面归零，但这似乎打破了
。当页面停止响应时，applyBindings
，不再连接

所以——我有了
myModel
——它工作得很好。这是一个“订单”，上面有一个按顺序排列的物品列表（比如说产品）和客户信息。如何将新订单加载到模型中

我真的不想拆掉和“重置”每一个子观测。我只想刷新它，就像ko.mapping一样——坦白说，如果我必须走过去打扫房间——那有什么意义呢？回到ko.mapping，让它处理所有这些

因此，对于我精心构建的viewmodel，我如何使用来自AJAX/REST（它是JSON）的一整套新数据来更新它呢？比如
ko.mapping.fromJS
做了什么？
这确实令人沮丧，使用
ko.utils.extend
来扩展外部刷新。这对我来说效果不太好，可能是因为我在每个对象中引用了
self
，
this
，以及
return self

本质上，我将我的
满足需求模型
（最重要的）更改为：

您会注意到，我将两个主要的可观察属性设置为空（requisionid
和
FulfillItemList
），然后创建了一个
self.update
函数，该函数将根据传入的内容将这些字段重置为content或null。我肯定有比使用
$更优雅的东西。每个
都可以推送。可能是
ko.utils.arrayMap
或类似的，但这是有效的

TLDR:
我在viewmodel中创建了一个更新例程。这并不完美，因为现在当我
ko.mapping.toJS
it将它发送回C#/REST-API时，它就有了这个功能，但这也很好，因为它使用它的方式忽略了任何额外的功能

public IHttpActionResult testloadpart(FulfillRequisitionRequest incoming) {
//do stuff
//incoming.update does not exist.
//incoming.NumberOfItems does not exist.
//incoming.RequisitionId DOES exist

}


public partial class FulfillRequisitionRequest {

    [XmlElementAttribute(Order = 0)]
    public long RequisitionId { get; set; }
    [XmlArrayAttribute(Order = 1)]
    [XmlArrayItemAttribute("FulfillItem", IsNullable = false)]
    public List<fulfillItem> FulfillItemList { get; set; }

    public FulfillRequisitionRequest() {
        FulfillItemList = new List<fulfillItem>();
    }
}

public IHttpActionResult testloadpart（完成请求传入）{
//做事
//传入的.update不存在。
//incoming.NumberOfItems不存在。
//incoming.RequisitionId不存在
}
公共部分类满足请求{
[XmlElementAttribute（顺序=0）]
公共长请求ID{get；set；}
[XmlArrayAttribute（Order=1）]
[XmlArrayItemAttribute（“FulfillItem”，IsNullable=false）]
公共列表LiteMList{get；set；}
公共履行要求请求（）{
FulfillItemList=新列表（）；
}
}

public IHttpActionResult testloadpart(FulfillRequisitionRequest incoming) {
//do stuff
//incoming.update does not exist.
//incoming.NumberOfItems does not exist.
//incoming.RequisitionId DOES exist

}


public partial class FulfillRequisitionRequest {

    [XmlElementAttribute(Order = 0)]
    public long RequisitionId { get; set; }
    [XmlArrayAttribute(Order = 1)]
    [XmlArrayItemAttribute("FulfillItem", IsNullable = false)]
    public List<fulfillItem> FulfillItemList { get; set; }

    public FulfillRequisitionRequest() {
        FulfillItemList = new List<fulfillItem>();
    }
}