Question

目前我的设置如下：

    ko.applyBindings(viewModel);

    $(".removeButton").live("click", function() {
        viewModel.ProductCategories.destroy(ko.dataFor(this));
    });

    $(".renameButton").live("click", function() {
        ko.dataFor(this).Name("Renamed Successfully!");
    });

在我介绍子元素的概念之前，这对我来说很好。此时，删除事件不再适用于这些项目。

是否有一种更通用的方式来摧毁＆＃34;元素？

KO显然知道我点击的元素（因为我可以重命名）。

[{"Id":1,"Name":"Bikes","Parent":null,"Children":[{"Id":5,"Name":"Mountain Bikes","Parent":1,"Children":null},{"Id":6,"Name":"Road Bikes","Parent":1,"Children":null},{"Id":7,"Name":"Touring Bikes","Parent":1,"Children":null}]},{"Id":2,"Name":"Components","Parent":null,"Children":[{"Id":8,"Name":"Handlebars","Parent":2,"Children":null},{"Id":9,"Name":"Bottom Brackets","Parent":2,"Children":null},{"Id":10,"Name":"Brakes","Parent":2,"Children":null},{"Id":11,"Name":"Chains","Parent":2,"Children":null]}]

上述事件将对任何元素（子元素或其他元素）起作用，但remove除了仅适用于根元素的元素。

我可以在元素本身上调用remove吗？或者我是否必须添加一些方法来解决它在数组中的位置并将其销毁？

例如

;这是更可取的：

    $(".removeButton").live("click", function() {
        ko.dataFor(this).destroy();
    });

到此：

    $(".removeButton").live("click", function() {
          viewModel.ProductCategories[someindex].Children.destroy(ko.dataFor(this));
    });

谢谢，钢钣

Answer 1

主要问题是在尝试销毁某个项目时确定父数组是谁。

有几种选择：您可以使用ko.dataFor而不是ko.contextFor来返回包含$data, $parent, $parents和$root等属性的对象。

如果您的数组具有相同的名称，那么您可以执行以下操作：http://jsfiddle.net/rniemeyer/xJjK8/

如果你的数组有不同的名字，那么你可以在button元素上添加一个提示来理解父类的名称，如：http://jsfiddle.net/rniemeyer/arpNx/

否则，如果您真的希望它是通用的，那么您可以使用with绑定来强制使用范围块，这样您就可以通过$parent访问父数组。但是，这将是unwrapped数组，我们真的想要observableArray。通过一些额外的工作，您可以遍历父项父项的属性，并将底层数组与未展开的数组进行比较，以找到您希望使用项目调用destroy的实际observableArray。像这样：http://jsfiddle.net/rniemeyer/bBVrE/

最后，如果您注意创建对象的方式，您可以将销毁功能推送到项目本身，而不是直接访问父项。下面的示例显示了向使用传递给构造函数的父对象的对象添加destroyMe方法：http://jsfiddle.net/rniemeyer/Eeryh/

KnockoutJs beta 3.0 - 你如何摧毁儿童元素？

1 个答案: