根据 meteor 中的 select 下拉框过滤 collection
Filter collection based on select dropdown box in meteor
我正在尝试根据 select 下拉列表中的 select 值过滤我的 collection。我已经尝试了 and here 的解决方案,但它对我来说效果不佳。下面是我想要 filter.the select 下拉列表在另一个模板 categoryFilter
中的模板,我在这里使用 {{> categoryFilter}}
调用它来过滤 collection 下的列表{{#each car}}
块。我在模式中使用的字段是 ccategory
我想过滤的字段
<template name="carsList">
<div class="col s12 filter-holder">
<div class="col m4 s4 filter-box">
{{> categoryFilter}}
</div>
</div>
<div class="col s12">
<ul class="collection" id="listings">
{{#each cars}}
<li>
{{> carItem}}
</li>
{{/each}}
</ul>
</div>
</template>
这是我现有的呼叫所有汽车的助手
Template.carsList.helpers ({
'allCars': function() {
return Cars.find();
},
});
这就是我的活动的样子。 var pageSession=ReactiveDict();
Template.carsList.events({
"click .categoryselection": function(e, t){
var text = $(e.target).text();
pageSession.set("selectedCategory",text);
}
});
我正在为此使用 ReactiveDict()
软件包 filtering.Am 我一直在做吗?我如何过滤值并在 <ul>
列表中调用它们并过滤 <li>
values.Please 帮助我
因为您一次只存储一个值(所选类别),所以在这种情况下没有必要使用 ReactiveDict
,是吗?如果是这样,您可以使用 ReactiveVar 代替:
Template.carsList.onCreated(function () {
this.selectedCategory = new ReactiveVar();
});
Template.carsList.helpers ({
'allJobs': function() {
var category = Template.instance().selectedCategory.get();
return Cars.find(category ? {ccategory: category} : {});
},
});
Template.carsList.events({
"click .categoryselection": function(e, t){
var text = $(e.target).text();
t.selectedCategory.set(text);
}
});
如果您仍想对 ccategory
和 city
等多个过滤器值使用 ReactiveDict
,您可以使用:
Template.carsList.helpers ({
'allJobs': function() {
var filter = {};
var category = pageSession.get("selectedCategory");
var city = pageSession.get("selectedCity");
if (city)
filter.city = city;
if (category)
filter.ccategory = category;
return Cars.find(filter);
},
});
Template.carsList.events({
"click .categoryselection": function(e, t){
var text = $(e.target).text();
pageSession.set("selectedCategory",text);
},
"click .cityselection": function(e, t){
var text = $(e.target).text();
pageSession.set("selectedCity",text);
}
});
我正在尝试根据 select 下拉列表中的 select 值过滤我的 collection。我已经尝试了 categoryFilter
中的模板,我在这里使用 {{> categoryFilter}}
调用它来过滤 collection 下的列表{{#each car}}
块。我在模式中使用的字段是 ccategory
我想过滤的字段
<template name="carsList">
<div class="col s12 filter-holder">
<div class="col m4 s4 filter-box">
{{> categoryFilter}}
</div>
</div>
<div class="col s12">
<ul class="collection" id="listings">
{{#each cars}}
<li>
{{> carItem}}
</li>
{{/each}}
</ul>
</div>
</template>
这是我现有的呼叫所有汽车的助手
Template.carsList.helpers ({
'allCars': function() {
return Cars.find();
},
});
这就是我的活动的样子。 var pageSession=ReactiveDict();
Template.carsList.events({
"click .categoryselection": function(e, t){
var text = $(e.target).text();
pageSession.set("selectedCategory",text);
}
});
我正在为此使用 ReactiveDict()
软件包 filtering.Am 我一直在做吗?我如何过滤值并在 <ul>
列表中调用它们并过滤 <li>
values.Please 帮助我
因为您一次只存储一个值(所选类别),所以在这种情况下没有必要使用 ReactiveDict
,是吗?如果是这样,您可以使用 ReactiveVar 代替:
Template.carsList.onCreated(function () {
this.selectedCategory = new ReactiveVar();
});
Template.carsList.helpers ({
'allJobs': function() {
var category = Template.instance().selectedCategory.get();
return Cars.find(category ? {ccategory: category} : {});
},
});
Template.carsList.events({
"click .categoryselection": function(e, t){
var text = $(e.target).text();
t.selectedCategory.set(text);
}
});
如果您仍想对 ccategory
和 city
等多个过滤器值使用 ReactiveDict
,您可以使用:
Template.carsList.helpers ({
'allJobs': function() {
var filter = {};
var category = pageSession.get("selectedCategory");
var city = pageSession.get("selectedCity");
if (city)
filter.city = city;
if (category)
filter.ccategory = category;
return Cars.find(filter);
},
});
Template.carsList.events({
"click .categoryselection": function(e, t){
var text = $(e.target).text();
pageSession.set("selectedCategory",text);
},
"click .cityselection": function(e, t){
var text = $(e.target).text();
pageSession.set("selectedCity",text);
}
});