2017-02-09 12 views
0

У меня есть шаблон рендеринга моей коллекции с помощью {{#each Collection}}, я использую железо-маршрутизатор для маршрутизации этот шаблон, как это:фильтров Коллекции с использованием железо-маршрутизатор

Router.route('/home', function() { 
this.render('home'); 
this.layout('header'); 
}); 

, как я могу использовать кнопку фильтра «книги» поэтому железо-маршрутизатор применять этот фильтр для подписки, чтобы я мог видеть только отфильтрованную версию моей коллекции, как следующее:

Collection.find({category: "books"}); 

ответ

0

Есть несколько способов приблизиться к этому, но один простой способ будет для определения суб-маршрут, который принимает категорию как параметр:

Router.route('/collections/:category',{ 
    name: 'collections', 
    layoutTemplate: 'header', 
    data(){ 
    return Collections.find({category: this.params.category}); 
    } 
}); 

Тогда ваш код кнопки можно просто сделать Router.go('/collections/books'), но теперь вы можете иметь несколько кнопок, каждая привязанные к различным категориям.

+0

Ваш ответ представляется перспективным, однако Ждут» я работаю для меня. возможно, потому, что было недоразумение относительно шаблона «коллекции», поэтому я изменил имя на «home». –

+0

'name' должно быть именем шаблона, который вы хотите загрузить по маршруту. Если у вас есть 'layoutTemplate', то этот шаблон должен включать' {{> yield}} 'для вставки шаблона маршрута. –

0

Как предлагается здесь https://guide.meteor.com/data-loading.html#organizing-subscriptions, вы можете управлять подпиской в ​​Шаблоне, а не в маршруте. Так что вы можете сделать:

import {ReactiveDict} from 'meteor/reactive-dict'; 
import {Template} from 'meteor/templating'; 

Template.home.onCreated(function(){ 
    var that = this; 
    that.state = new ReactiveDict(); 
    //that.state.set('selected-category',YOUR_DEFAULT_CATEGORY); 
    that.autorun(function(){ 
    that.subscribe('subscription-name',that.state.get('selected-category')); 
    }); 
}); 

Template.home.events({ 
    'click .js-category':function(e,tpl){ 
    let category = tpl.$(e.currentTarget).data('category'); 
    tpl.state.set('selected-category',category); 
    } 
}); 

И в шаблоне:

<button type="button" data-category="books" class="js-category">Books</button> 

Надежда это поможет вам найти правильное решение для Вашего

 Смежные вопросы

  • Нет связанных вопросов^_^