使用 KnockOutJs 过滤

Question

我需要在这里使用table中的过滤器

<p>Filter: <input data-bind="value: filter, valueUpdate: 'afterkeydown'" /></p>

这是过滤框。

<table class="tbl" data-bind="visible: current">
    <thead>
        <tr data-bind="click:Table">
            <th width="25%" data-column="Name">Name</th>
        </tr>
     </thead>
<tbody data-bind="foreach: Page">

        <tr>
            <td>                   
                <span data-bind='text: Name'>name</span>
            </td>
</tr>
</tbody>

这 table 它将绑定来自数据库的名称

var ModelsViewModel = function () {
    var self = this;
    self.Name = ko.observable("");
    self.filter = ko.observable("");
    self.List = ko.observableArray();

//---filter starts
    ModelsViewModel.filteredItems = ko.dependentObservable(function () {
        var filter = self.filter().toLowerCase();
        if (!filter) {
            return self.List;
        } else {
            return ko.utils.arrayFilter(self.List(), function (ManageList) {

                return ko.utils.stringStartsWith(List.Name.toLowerCase(), self.filter);

            });
        }
    }, ModelsViewModel);
    //-----------ends
  }

输入完成后显示错误

TypeError: ko.utils.stringStartsWith is not a function

return ko.utils.stringStartsWith(List.Name.toLowerCase(), self.filt...

Answer 1

ko.utils.stringStartsWith 在 Knockout 2.0 版中被移除。

另请参阅此 github 问题：ko.utils.stringStartsWith missing in release file #401

您可以创建和使用自己的 startsWith 方法，例如（示例代码取自链接的 github 问题）：

var stringStartsWith = function (string, startsWith) {          
    string = string || "";
    if (startsWith.length > string.length)
        return false;
    return string.substring(0, startsWith.length) === startsWith;
};

你用你的方法：

return ko.utils.arrayFilter(self.List(), function (ManageList) {

    return stringStartsWith(List.Name.toLowerCase(), self.filter);

});

使用 KnockOutJs 过滤

Filter Using KnockOutJs

string

filter

razor

knockout.js