1

我有一个命名项目数组，其中每个都包含其他命名项目数组（某种树）。我需要在两个数组中实现按名称过滤。

所以我检查名称第一个数组的每个项目：

  • 如果名称合适，我会显示整个分支。
  • 如果名称不合适，我正在检查子数组：
    • 如果子数组不包含合适的命名项，我不会显示分支。
    • 如果子数组包含合适的命名项目，我只显示包含合适项目的分支。

我已经通过以下方式实现了它：

ko.utils.stringStartsWith = function (string, startsWith) {
    if (startsWith.length > string.length)
        return false;

    return string.substring(0, startsWith.length) === startsWith;
};

$(function () {
    var vm = {
        search: ko.observable(''),
        items: ko.observableArray([])
    };

    //jsonData - my data
    $.each(jsonData, function (i, jItem) {
        var item = {
            name: jItem.Name,
            search: ko.observable(''),
            subItems: ko.observableArray([])
        };

        $.each(jItem.Items, function (j, jsubItem) {
            var subItem = {
                name: jsubItem.Name,
            };

            item.subItems.push(subItem);
        });

        item.filteredSubItems = ko.computed(function () {
                var self = this;

                return ko.utils.arrayFilter(this.subItems(), function (fsubItem) {
                    if (self.search().length == 0
                        || ko.utils.stringStartsWith(fsubItem.name.toLowerCase(), self.search().toLowerCase())) {
                        return true;
                    }

                    return false;
                });
            }, item);
        vm.items.push(item);
    });

    vm.filteredItems = ko.computed(function () {
        var self = this;

        return ko.utils.arrayFilter(this.items(), function (fitem) {
            if (self.search().length == 0
                || ko.utils.stringStartsWith(fitem.name.toLowerCase(), self.search().toLowerCase())) {
                fitem.search('');
                return true;
            }

            fitem.search(self.search());

            if (fitem.filteredSubItems().length != 0)
                return true;

            return false;
        });
    }, vm);

    ko.applyBindings(vm);
});

所以它运作良好，但计算filteredItems看起来对我来说是丑陋的解决方法。此外，我关心我的解决方案的性能。

有人知道更多的林间空地解决方案吗？

4

1 回答 1

1

我半年前问过这个问题，我忘了说我找到了这个问题的答案。不错且简单的解决方案是Knockout Mapping。

于 2013-07-29T20:05:18.100 回答