搜索和排序过滤器答案

【问题标题】：Search and Sort Filter搜索和排序过滤器
【发布时间】：2020-01-18 06:55:18
【问题描述】：

搜索过滤器不适用于使用 Enter 键多次搜索元素。一次搜索一个时效果很好。例如：如果我在特定列中搜索字母“A”，则输出应该是其中包含“A”的数据。但是，当我退格“A”并在同一列中搜索其他字母时，它会重新过滤以前的列表，这不应该是这种情况。对于每次搜索，它都需要从原始列表中过滤，而不是从已过滤的列表中过滤。

我尝试过使用 executeOnEnter & keyup。

vm.filterStatus= function () {
        if (!vm.statuses()) {
            vm.filteredStatuses([]);
        }
        var filter = vm.searchTerm().toLowerCase();

        if (!filter) {
            vm.refresh();
            vm.filteredStatuses(vm.statuses());     

        }       
        var filtered = ko.utils.arrayFilter(vm.statuses(), function (item) {            

            var fields;
            if (vm.checkForWhichFilter() == 'A') {
                fields = ["carClasses"];
            }
            else if (vm.checkForWhichFilter() == 'F')
            {
                fields = ["fromDepotCodes"];
            }
            var i = fields.length;
            while (i--) {
                var prop = fields[i];
                if (item.hasOwnProperty(prop) && ko.isObservable(item[prop])) {
                    var strProp = ko.utils.unwrapObservable(item[prop]).toString().toLocaleLowerCase();
                    if (item[prop]() && (strProp.indexOf(filter) !== -1)) {
                        oldAppvehicle = vm.applicableVehicle();
                        return true;
                    }
                }
            }            
            return false;
        });
        vm.statuses(filtered);
    };

 <input type="text" class="form-control-static" data-bind="value:searchTerm ,valueUpdate: 'keyup',executeOnEnter:filterStatus" placeholder="Press enter to search..." />

对于每次搜索，它都需要从原始列表中过滤，而不是从已经过滤的列表中过滤。

【问题讨论】：

标签： javascript html mvvm knockout.js knockout-mvc

【解决方案1】：

您正在过滤vm.statuses，然后将过滤后的结果保存在vm.statuses。因此，下次过滤时，您将过滤先前过滤的结果。您应该将过滤后的结果存储在一个单独的可观察数组中，以便原始的、未过滤的数组保持不变并且可以再次过滤。我在您的代码中看到了对vm.filteredStatuses 的引用，所以您可能需要做的就是更改：

vm.statuses(filtered);

到：

vm.filteredStatuses(filtered);

显然，在您的 UI 中显示 filteredStatuses 而不是 statuses。

【讨论】：