基本上我有我的“主页”模板,它显示了两个具有不同内容的相同表格。Home-Template 上的表格只显示每张桌子最近的五个“订单”。通过单击表头(模板“showLatestOrders”中的 h2),我想路由到他们自己的模板,其中显示了完整的列表。
我知道我可以使用许多不同的模板。但这似乎很丑陋。
我正在使用 iron:router,我想知道如何在我的模板“showLatestOrders”中使这个“pathFor”动态化,所以我只需要一个模板来用于我的所有概览表。
模板:
<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({});
};