KnockoutJS：如何从子数组中删除项？

问题：

我还在学习淘汰赛，如果我的方法有误，请指导我。

这是我的小提琴： http ： //jsfiddle.net/amitava82/wMH8J/25/

在onclick编辑时，我收到了json模型，它在视图中表示，我想从模型中删除某些项（子数组）或操作（父数组）（我删除了添加UI以添加更多来自小提琴的动作以简化）然后最终将模型传递回服务器。

现在，从根级别删除很容易。 我坚持删除ActionItems数组中ActionParamaters的单个项目。

题：

如何从子arrays中删除项目？

Answer 1

您可以将单击的actionItem和包含的action数组传递给deleteActionItem函数，如下所示：

 remove item 

在你的模型中，你需要使用ko.mapping插件使每个actionItem数组都可观察（参见编辑function）

 var viewModel = function() { var self = this; self.data = ko.observable(); self.edit = function() { self.data ( ko.mapping.fromJS(editData) ); } self.log = function() { console.log(self.data()) } self.deleteAction = function(data) { //delete root node self.data().remove(data) } self.deleteActionItem = function(data,actionItem) { //delete items data.ActionItems.remove(actionItem); } } 

然后，您将能够从deleteActionItem函数中的数组中删除该项，并且由于该数组现在是可观察的，因此结果将反映到绑定的dom元素。

Answer 2

山姆，你的小提琴数据太复杂了。 在提问时，如果你将你的小提取物提炼到相关元素，你将提高获得帮助的机会。 我已经制作了一个简单的小提琴 ，用于说明嵌套数组和删除。

这是HTML，请注意remove函数位于数组的上下文中，因此它调用$parent而不是$root的函数。 这使我们可以直接在上面定位上下文，而不是根目录。

 
 
  Remove Parent ...  Remove Child 
​ 

这是父模型。 注意这里的删除function是为了删除孩子。 当调用removeChild函数时，它来自子上下文，询问$parent ，它将调用此remove。

 var Parent = function(name, children) { var self = this; self.name = ko.observable(name); self.children = ko.observableArray(children); self.removeChild = function(child) { self.children.remove(child); }; }; 

您的小提琴也不使用模型，这是MVVM开发的一个重要方面。 您应该考虑浏览淘汰站点上的教程，以便更好地了解如何构建淘汰应用程序。 它将帮助您更轻松地处理这类问题。