2014-09-30 5 views
0

В принципе у меня есть мой «Home» -Template, который показывает две идентичные таблицы с различным контентом. В таблицах на домашнем шаблоне показаны только последние пять «заказов» на таблицу. С кликом по заголовку таблицы (h2 в Шаблоне "showLatestOrders"), я хочу направить свой собственный шаблон, где будет показан полный список.Создание динамических шаблонов и pathFor

Я знаю, что мог бы создать много разных шаблонов. Но это кажется очень уродливым.

Я использую железо: маршрутизатор, и мне интересно, как я могу сделать этот «путь» в моем шаблоне «showLatestOrders» динамичным, поэтому мне нужен только один шаблон для всех моих обзорных таблиц.

Шаблоны:

<template name="home"> 
    <div class="container"> 
    <h1>Home</h1> 
    <div> 
     {{> showLatestOrders heading="Closed Orders" data=getLatestClosedOrders}} 
    </div> 
    <div> 
     {{> showLatestOrders heading="Open Orders" data=getLatestOpenOrders}} 
    </div> 
    </div> 
</template> 

<template name="showLatestOrders"> 
    <h2><a href="{{pathFor 'orderOverview'}}">{{this.heading}}</a> 
    </h2> 
    <div> 
    <table > 
     <thead> 
     <tr> 
      <th>Number</th> 
      <th>Price</th> 
     </tr> 
     </thead> 
     <tbody> 
     {{#each data}} 
      <tr> 
      <td>{{number}}</td> 
      <td>{{price}}</td> 
      </tr> 
     {{/each}} 
     </tbody> 
    </table> 
    </div> 
</template> 

<template name="orderOverview"> 
    <div class="container"> 
     <h1>How to get a dynamic heading and collection here, based on where the route comes from?</h1> 
     {{> reactiveTable collection=getOrders }} 
    </div> 
</template> 

Помощники:

Template.home.getLatestOpenOrders = function() { 
    var data = Orders.find({ 
     // get just open orders 
    }, { 
     limit: 5 
    }); 
    return data; 
} 

Template.home.getLatestCompletedOrders = function() { 
    var data = Orders.find({ 
     // get just completed orders 
    }, { 
     limit: 5 
    }); 
    return data; 
} 

Template.orderOverview.getOrders = function() { 
    return Orders.find({}); 
}; 
+0

вы хотите, чтобы определить текущий URL ли? – yoK0

+0

Нет, я хочу перейти к моей динамике шаблона "orderOverview". Поэтому я могу использовать его для нескольких контекстов данных. Therefor мне нужно вставить переменную внутри моего железного маршрутизатора ссылку, как: {{this.heading}} Но тогда я просто получить «/orderOverview?view=this.heading» и this.heading не решает. – peggel

+0

this.heading исходит из предыдущего вызова в виде пробелов: {{> showLatestOrders heading = "Open Orders" data = getLatestOpenOrders}} – peggel

ответ

0

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

В шаблоне:

<a href="{{pathFor 'orderOverview' heading=this.heading}}">{{this.heading}}</a> 

В маршрутах:

Router.map(function() { 
    // your routes etc. 
    this.route('orderOverview', { 
     path: '/orderOverview/:heading', 
     onBeforeAction: function() { 
      Session.set('heading', this.params.heading); 
     } 
    }); 
}); 

в помощниках:

Template.orderOverview.getOrders = function() { 
    return Orders.find({"heading": Session.get('heading')}); 
};