实时搜索过滤器具有嵌套级别的淘汰赛js

时间:2014-09-01 14:39:24

标签: search knockout.js filter

我已经了解了如何处理Knockout.js中的实时搜索过滤功能。但是我有一种新的复杂要求,即最终输出看起来如下......

enter image description here

当用户点击列出的搜索结果时,他可能会有另一组子列表,其中应该有' n'钻井数量!

我试过简单的实时搜索过滤功能。我失去了一些东西。我不知道如何从Json加载多级数据以及如何在淘汰JS中进行绑定。

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

我偶然发现了类似的问题。重要的是要了解Knockout如何检测哪个可观察值会影响计算值。我注意到,在所有示例中,在计算函数范围内调用了observable。如果我在过滤器函数(子范围)上调用它,则不会更新计算。我尝试在计算函数的开头调用它们,以便过滤函数可以通过同一范围内的变量访问值。这似乎有效,并且每次可观察到变化 - 计算更新。

在这里,我修改了你的计算机,它会过滤所有字段。

self.filteredRecords = ko.computed(function () {
    var idSearch = self.idSearch(),
        nameSearch = self.nameSearch().toLowerCase(),
        townSearch = self.townSearch();
    return ko.utils.arrayFilter(self.records(), function (r) {
        return r.id.toString().indexOf(idSearch) !== -1 &&
            r.name.toLowerCase().indexOf(nameSearch) !== -1 &&
            (r.homeTown === townSearch || townSearch === "");
    });
});

http://jsfiddle.net/67kgm/127/