将值推入嵌套的ko.observableArray

我希望将供应商列表嵌入到我从服务器获得的现有JSON Payload中，具体取决于JSON Payload中的项是否需要供应商。

我最终想要的是这样的事情：

{ "ProductName": "Product123", "RequiredComponents": "CAP 10% H/Vol", "StockCode": "142111411", "RequiredQtyByBom": 4, "QtyUnassignedInWarehouse": 0, "QtyAllocatedInWarehouse": 40, "PCBReference": "442C", "QtyOnOrder": 26, "Vendors": [], "RequireVendor": false }, { "ProductName": "Product123", "RequiredComponents": "Screws", "StockCode": "Screws", "RequiredQtyByBom": 1, "QtyUnassignedInWarehouse": 0, "QtyAllocatedInWarehouse": 14, "PCBReference": "Screws", "QtyOnOrder": 26, "Vendors": [ {"VendorID": "3", "VendorName": "ABC Supplier", "VendorMOQ": 50000, "VendorItemPrice": 322}, {"VendorID": "4", "VendorName": "DEF Supplier", "VendorMOQ": 4, "VendorItemPrice": 120} ], "RequireVendor": true }, { "ProductName": "Product123", "RequiredComponents": "14141415", "StockCode": "151555231", "RequiredQtyByBom": 1, "QtyUnassignedInWarehouse": 0, "QtyAllocatedInWarehouse": 170, "PCBReference": "1414", "QtyOnOrder": 26, "Vendors": [], "RequireVendor": false } 

我想用2个AJAX调用将这个值推入Observable数组。

AJAX调用1：创建产品的初始有效负载

  MyDataViewModel.SelectedOrderID.subscribe = ko.computed(function () { $.ajax({ url: "/URLToMethod/GetBomStockByProductID", data: { OrderID: ko.toJS(MyDataViewModel.SelectedOrderID) }, type: "GET", contentType: "application/json; charset=utf-8", dataType: "JSON", timeout: 10000, success: function (Result) { for (var i = 0; i  element.QtyAllocatedInWarehouse) { return true } else { return false } }) } ); } }, error: function (xhr, status) { alert(status + " - " + xhr.responseText); } }); }); 

AJAX调用2：将值推送到供应商ko.observableArray（）在First payload中创建

  MyDataViewModel.PurchaseReqHasVendorDetails = ko.computed(function () { var self = MyDataViewModel; for (var i = 0; i < self.CheckStock().length; i++) { if (self.CheckStock()[i].RequirePO()) { $.ajax({ url: "/URLToMethod/GetVendorsByProductName", data: { ProductName: self.CheckStock()[i].ProductName }, type: "GET", contentType: "application/json; charset=utf-8", dataType: "JSON", timeout: 10000, success: function (Result) { for (var i = 0; i < Result.d.length; i++) { element = Result.d[i]; self.CheckStock()[i].Vendors.push({ VendorID: element.VendorID, VendorName: element.VendorName, VendorMOQ: element.VendorMOQ, VendorPrice: element.VendorPrice }); } }, error: function (xhr, status) { alert(status + " - " + xhr.responseText); } }); return true; } else { return false; } } }); 

但这不起作用。 它创建初始有效负载，但它不获取第二个有效负载并将其推入我创建的observableArray。

任何建议将不胜感激

Answer 1

您可以使用映射插件轻松完成此操作。 假设你从服务器中检索一个稍微不同的JS（或者在收到它之后稍微修改它），如下所示：

 var data = { [ /* Your example data with products and nested vendors here */ ] } 

创建视图模型可以很简单：

 var viewModel = ko.mapping.fromJS(data); ko.applyBindings(viewModel); 

如果您不想使用自动生成的视图模型但使用自己的ViewModel构造函数，则可以使用映射插件添加其他“映射选项”。 文档中有很好的例子。

这是一个包含您的数据的演示文件 。