0

基本上我有我的“主页”模板,它显示了两个具有不同内容的相同表格。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({});
};
4

1 回答 1

0

pathFor可以为路由获取参数。我要做的是将标题信息作为路线的参数传递,并将其保存在 Session 变量中以在帮助程序中访问:

在模板中:

<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')});
};
于 2015-04-29T19:31:24.610 回答