【问题标题】:Live search filter knockout js with nested level具有嵌套级别的实时搜索过滤器淘汰赛js
【发布时间】:2015-01-16 21:57:17
【问题描述】:
我知道如何在 Knockout.js 中使用实时搜索过滤器功能。但我有一种新的复杂要求,即最终输出如下所示......
当用户点击列出的搜索结果时,他可能会有另一组子列表,其中应该有“n”个向下钻取!
我尝试了简单的实时搜索过滤功能。我失去了一些东西。我不知道如何从 Json 加载多级数据以及如何在淘汰赛 JS 中绑定它。
有什么想法吗?
【问题讨论】:
标签:
search
knockout.js
filter
【解决方案1】:
我偶然发现了类似的问题。重要的是要了解 Knockout 如何检测哪个可观察值影响计算值。我注意到,在所有示例中,可观察对象都是在计算函数范围内调用的。如果我在过滤器函数(子范围)上调用它,则计算不会更新。我尝试在计算函数的开头调用它们,以便过滤函数可以通过同一范围内的变量访问值。这似乎有效,并且每次可观察值发生变化 - 计算更新。
在这里我修改了你的计算,它过滤了所有的字段。
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/