knockout无法通过映射过滤observable

时间:2013-12-06 20:07:30

标签: knockout.js knockout-mapping-plugin

我从this postthis fiddle大量借用,但无法根据用户输入过滤我的表格。我试图允许用户按描述名称过滤列表。看起来过滤“函数”从未被调用,但我不确定为什么。

我在使用和不使用映射插件的情况下尝试了这个,并且我尝试在标签上使用模板(而不仅仅是tbody标签上的foreach),以防需要模板。每次我都可以让Knockout将我的所有viewModel的值绑定到HTML表,但是在过滤器文本框中输入什么都不做。

Please see this fiddle for the complete code,欢迎提出任何建议。感谢

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


var jsonData = '[{"supplier":"HD Supply","itemNumber":"117983","description":"PAPER 
TOWEL DISPENSER","quantity":"1","price":"65.79"},
{"supplier":"Fun Express","itemNumber":"62_9115","description":"Learning 
Charts","quantity":"1","price":"5.80"},
{"supplier":"Royal Coffee","itemNumber":"4303","description":"Caffe Siena Coffee Clutch 
1300/cs","quantity":"1","price":"67.14"}]';

var viewModel = {
    cartItemsList : ko.mapping.fromJSON(jsonData),
    filter : ko.observable("")
};

viewModel.filteredItems = ko.dependentObservable(function () {
    var filter = this.filter().toLowerCase();
    if (!filter) {
        return this.cartItemsList();
    } else {
        return ko.utils.arrayFilter(this.cartItemsList(), function (cartItemsList) {
            return (cartItemsList.description().toLowerCase().indexOf(filter) > -1);
        });
    }
}, viewModel);

ko.applyBindings(viewModel, document.getElementById("tblShoppingCart"));

0 个答案:

没有答案