Knockout.js - 使用多个条件过滤计算

时间:2012-11-15 07:26:52

标签: knockout.js

尝试使用多个条件过滤计算。我看过很多例子,其中return语句嵌套了多个条件,但我真的不明白为什么它们有效。我的示例可能不是嵌套返回语句的候选者,但我不确定如何执行此操作。

//ko.utils.arrayFilter - filter the items using the filter text
viewModel.filteredItems = ko.computed(function() {
    var filter = this.filter().toLowerCase();
    if (!filter) {
        return this.items();
    } else {
        return ko.utils.arrayFilter(this.items(), function(item) {
            return (item.fullName().toLowerCase().indexOf(filter) > -1);
        });
    }

    //*** THIS LOGIC WORKS BY ITSELF BUT NOT COMBINED WITH THE ABOVE LOGIC ***
    //var t = this.selectedTag();
    //if (t == "all") return this.items();
    //return ko.utils.arrayFilter(this.items(), function(item) {
    //    return item.tag == t;
    //});

}, viewModel);

以下是小提琴中的完整示例:http://jsfiddle.net/boyus/qTb5Q/12/

提前致谢。

1 个答案:

答案 0 :(得分:1)

我认为您的计算中的逻辑略有不正确,并且您没有在数据绑定中正确设置所选标记。

请查看http://jsfiddle.net/qTb5Q/14/以获得有效的解决方案。

这是改变的计算函数:

  viewModel.filteredItems = ko.computed(function() {
      var filter = this.filter().toLowerCase();
      if (!filter) {
        var t = this.selectedTag().toLowerCase();
        if (!t || t == "all") return this.items();
        return ko.utils.arrayFilter(this.items(), function(item) {
            return item.tag().toLowerCase() == t;
        });
      } else {
          return ko.utils.arrayFilter(this.items(), function(item) {
              return (item.fullName().toLowerCase().indexOf(filter) > -1);
          });
      }
  }, viewModel);