Bem, para preencher o select, você deve mudar o {{#each}} para o select, assim.
<select>
<option disabled selected>Choose option</option>
{{#each company}}
<option>{{category}}</option>
{{/each}}
</select>
Porque se você colocar o
{{#each}}
na parte superior do <select>
tag meteor criará 1 select para cada empresa. E o ajudante da empresa deve ser simples como um simples
return company.find();
Agora, se você deseja filtrar, existem muitas opções para fazer isso, uma delas pode ser essa.
Eu gosto de usar ReactiveDict(); , então vou usar neste exemplo.
Instale-o
meteor add reactive-dict
Template.example.onCreated(function(){
var self = this;
self.example = new ReactiveDict();
self.example.setDefault( 'valueToFilter' , null);
});
Agora em algum evento como
change
, faça o seguinte. Template.example.events({
'change select' : function( event, template ) {
var instance = Template.instance();
instance.example.set( 'valueToFilter' event.target.value ); //or use $('select').val() whatever you like to take the value;
}
})
Agora mostre os resultados.
Template.example.helpers({
showSelectedValues : function(){
var instance = Template.instance();
return Companies.find( { name : instance.example.get( 'valueToFilter' )} );
}
})
Isso deve lhe dar uma imagem grande, boa sorte!