Question

Hello应用程序必须允许用户过滤数据集合中包含的数据。必须由复选框支持过滤器。用户选择（复选框）它有趣的数据（名称，地址...）并提交您的选择。下表显示了数据集中的选定数据。

有没有人知道它应该看起来像是从数据集合中检索数据的代码，同时考虑到用户进行的过滤。

我的想法是。获取复选框的值并将它们保存在数组中，然后在代码中包含数组中的数据，以使用子例程find（）从集合中检索数据。

'change .cd-checkbox-1': function(event, target) {
var x = event.target.checked;
Session.set("statevalue", x);
var array    = [];
if (Session.get("statevalue") === true) {
    $( "[name='inputCheckboxPodmiot']:checked" ).each( function( index, element ) {
      array.push( element.value );
    });
};
var arrayLength = array.length;
for (var i = 0; i < arrayLength; i++) {
    var abiRejestr = WkaRejestrAbi.find( {}, { fields: { array[i]: 1 } } );
}
}

Answer 1

一种方法是使用Reactive Vars。建议不要使用会话，因为它们会污染全局命名空间。

示例代码：

在main.html

<template name="test">
     <input type="checkbox" id="checkbox1" name="name" value="data">Check Me
     <input type="checkbox" id="checkbox2" name="name" value="data">Check Me2
     <input type="checkbox" id="checkbox3" name="name" value="data">Check Me2
      {{showData}}
</template>

在Main.js

 var check_status='';
 //Reactive Var Initialization
 Template.main.onCreated(function (){
       check_status1=new ReactiveVar({});
       check_status2=new ReactiveVar({});
       check_status3=new ReactiveVar({});

 });

 Template.main.helpers({
       showData : function(){
           return Collection.find({$and : [{check_status1.get(),check_status2.get(),check_status3.get()}]}).fetch();
       }
 });

 Template.main.events({
      "change #checkbox1" : function(event) {
            if($(event.currentTarget).is(":checked").val())
              check_status1.set({field1: 'data1'});
            else
               check_status1.set({});
       },
       "change #checkbox2" : function(event) {
            if($(event.currentTarget).is(":checked").val())
              check_status2.set({field2: 'data2'});
            else
               check_status2.set({});
       },
       "change #checkbox3" :function(event) {
            if($(event.currentTarget).is(":checked").val())
               check_status3.set({field3: 'data2'});
            else
               check_status3.set({});
       },
 });

说明：

当我们初始化反应变量check_status时，我们将值设置为{}。在帮助程序中，在呈现时，相同的数据将传递给查询Collection.find(check_status.get())，这与显示所有数据一样好。

只要您点击该复选框，就会触发Template.main.events中描述的事件，该事件会将check_status的值设置为{field: data}。由于这是被动变量，因此重新运行showData模板，这次查询为Collection.find({field: data})，因此只有field匹配{{}的字段1}}被返回。

在使用这些命令之前，您需要添加'data'包（reactive var）。

或者，如果您想继续使用meteor add reactive-var变量，也可以使用Tracker.autorun。

允许用户过滤MeteorJS中

1 个答案: