首页 > 解决方案 > 反应表集合上的日期自定义过滤器

问题描述

我有一个在日期列上定义的自定义过滤器的反应表

Template.displayoptions.created = function () {
    this.timeFilter = new ReactiveTable.Filter('time-filter', ['deadline']);
};

Template.displayoptions.events({
'click .form-check-input'(event,template) {
    var timefilter = template.find('#timefilter:checked').value;

    var today = new Date();
    var thisweek = new Date(moment(today).add(7, 'days'));
    var thismonth = new Date(moment(today).add(1, 'month'));

    switch(timefilter){
        case "today":
            template.timeFilter.set({"$gte": today});
            break;
        case "thisweek":
            template.timeFilter.set({"$and":[{"$gte": today}, {"$lt" : thisweek}]});
            break;
        case "thismonth":
            template.timeFilter.set({"$and":[{"$gte": today}, {"$lt" : thismonth}]});
            break;
    }        


}

});

当事件被触发时(单选按钮选择今天/周/月),表格闪烁但数据保持不变。

可能缺少什么?

rowsPerPage: 5,
filters: ['time-filter'],
showNavigationRowsPerPage: false,
showFilter: false,

filter.get (我不确定这是否需要)

Template.displayoptions.helpers({
    checked: function () {
        var istimeFilter = _.isObject(Template.instance().timeFilter.get());
        if (istimeFilter) {
            return "checked";
        } 
        return "";
    } 
});

单选按钮

<div class="form-check form-check-inline">
  <input class="form-check-input" type="radio" id="timefilter" name="timefilter" value="today" {{checked}}>
  <label class="form-check-label" for="timefilter">Today</label>
</div>
<div class="form-check form-check-inline">
  <input class="form-check-input" type="radio" id="timefilter" name="timefilter" value="thisweek" {{checked}}>
  <label class="form-check-label" for="timefilter">This Week</label>
</div>
<div class="form-check form-check-inline">
  <input class="form-check-input" type="radio" id="timefilter" name="timefilter" value="thismonth" {{checked}}>
  <label class="form-check-label" for="timefilter">This Month</label>
</div>

标签: javascriptmongodbmeteorfilterreactive

解决方案


仍然不完全清楚,但我在服务器上发布了整个集合,然后它进行了一些更改 -

'change #timefilter'(event,template) {

    template.timeFilter.set("");
    var timefilter = template.find('#timefilter:checked').value;
    var startOfDay = moment().startOf('day').toDate();
    var endOfDay = moment().endOf('day').toDate();

    var startOfWeek = moment().startOf('week').toDate();
    var endOfWeek   = moment().endOf('week').toDate();
    var startOfMonth = moment().startOf('month').toDate();
    var endOfMonth = moment().endOf('month').toDate();

    switch(timefilter){
        case "today":
            template.timeFilter.set({"$gte": startOfDay, "$lt": endOfDay});
            break;
        case "thisweek":
           template.timeFilter.set({"$gte": startOfWeek, "$lt" : endOfWeek});
            break;
        case "thismonth":
           template.timeFilter.set({"$gte": startOfMonth, "$lt" : endOfMonth});
            break;
        default:
            break;
    }

我根本不需要使用 filter.get() 。

此外,正如插件作者所证实的那样 - 逻辑运算符(和/或)在自定义过滤器中不起作用


推荐阅读