Question

我有一张桌子我试图通过某些字段和标签在流星中添加过滤。现在，每行都有一个名为race和against的字段。表格上方有两个选择元素（race-select和against-select）您可以用来过滤掉您想要查看的表格上的哪些结果，但代码非常笨重，如果我想添加更多过滤对于其他标签，代码会变得更加混乱。

有些代码只是试图处理Session的初始值。

var racelist = ['zerg', 'terran', 'protoss'];

Template.buildsList.helpers({
  builds : function() {
    if (typeof(Session.get('race-select')) == 'undefined' || Session.get('race-select') == 'all races'){
      Session.set('race-select', racelist);
    }
    if (typeof(Session.get('against-select')) == 'undefined' || Session.get('against-select') == 'all races'){
      Session.set('against-select', racelist);
    }
    return Builds.find({race : {$in : Session.get("race-select")}, against : {$in : Session.get("against-select")}}, { sort: { createdAt: -1 } });
  }
});

Template.buildsList.events({
  "change #race-select" : function(e){
    Session.set('race-select', [$(e.target).val().toLowerCase()])
  },
  "change #against-select" : function(e) {
    Session.set('against-select', [$(e.target).val().toLowerCase()])
  }
})

有很多几乎重复的行，但我想知道是否有更好的方法来实现这种过滤功能。

Answer 1

我已检出的软件包在过去几天内添加了对自定义过滤器的支持。 https://atmospherejs.com/aslagle/reactive-table。您可以将多个自定义过滤器绑定到一个表，并且使用起来更简单。

代码最终看起来像这样：

Template.raceFilter.created = function() {
    this.filter = new ReactiveTable.Filter('race-filter', ['race']);
};

Template.raceFilter.events({
    "change" : function(event, template) {
        var input = $(event.target).val().toLowerCase();
        if(input != 'all races'){
            template.filter.set(input);
        }else {
            template.filter.set("");
        }
    }
});

raceFilter模板可以是任何类型的输入，（选择，文本框，无线电）。

更好地过滤流星表

1 个答案: