創建動態模板和路徑

基本上我有我的「主頁」 - 模板，它顯示兩個相同的表格與不同的內容。 Home-Template上的表格僅顯示每個表格的最新五個「訂單」。單擊表格標題（模板「showLatestOrders」中的h2），我想要路由到他們自己的模板，其中顯示完整列表。創建動態模板和路徑

我知道我可以只是許多不同的模板。但是這看起來非常難看。

我正在使用鐵：路由器，我不知道如何使我的模板「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({}); 
};

來源

2014-09-30 peggel

你要確定當前的網址是什麼？ – yoK0 2014-10-01 06:28:08

不，我想要路由到我的「orderOverview」模板動態。所以我可以將它用於多個數據上下文。爲此我需要插入像我的鐵路由器鏈路中的變量： {{this.heading}} 但我只是得到「/orderOverview?view=this.heading」和this.heading沒有解決。 – peggel 2014-10-01 06:41:24

this.heading來自之前的空格鍵調用： {{> showLatestOrders heading =「Open Orders」data = getLatestOpenOrders}} – peggel 2014-10-01 06:44:26

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')}); 
};

來源

2015-04-29 19:31:24

創建動態模板和路徑

回答

相關問題