如何在knockout

Question

我的self对象self.taskItems中有一个可观察数组，我在敲除foreach绑定中使用它来显示每个任务的内容。

基于某些任务过滤器，我需要更改taskItems的内容，然后点击清除过滤器时，我需要显示原始内容。

为了实现这个功能，我将上面的可观察数组克隆到另一个数组self.taskpanelAllItems(self.taskItems());

问题在于，当我从taskItems（）中删除内容时，它正在taskpanelAllItems()中删除克隆数组中的内容，如何防止这种情况？

在这些情况下工作的最佳方法是什么：克隆原始数组并修改它还是有其他方法吗？

Answer 1

  

根据一些任务过滤器，我需要更改此taskItems内容，当点击清除过滤器时，我需要显示我的原始内容。

不要尝试手动维护第二个（克隆的）项目列表。

相反，你应该设置一个过滤器observable：

self.filter = ko.observable();

和计算：

self.visibleTaskItems = ko.computed(function () {
    var filterValue = self.filter();
    return ko.utils.arrayFilter(self.taskItems(), function (taskItem) {
        // some sort of filter condition
        return !filterValue || taskItem.title().indexOf(filterValue) > - 1;
    });
});

现在，您可以让视图取决于visibleTaskItems：

<ul data-bind="foreach: visibleTaskItems">
  <li data-bind="text: title">
</ul>

现在，每当您更改或清除过滤器时，您的视图都会相应更新。

Answer 2

self.taskpanelAllItems(self.taskItems());

这不会克隆数组。它只是将相同的数组分配给另一个observable。最终会有两个指向同一阵列的observable。

要克隆数组，您需要专门调用一个执行此操作的函数：

self.taskpanelAllItems(self.taskItems.slice(0));

正如@Tomalak所暗示的那样，使用计算的observable是一种更好的方法，可以清楚地封装observable之间的关系。