Метеорные дубликаты шаблонов из-за различного содержания

Question

У меня есть панель меню, и у меня есть 3 разных страницы. В зависимости от того, на какой странице я нахожусь, содержимое внутри строки меню будет отличаться. Поскольку содержимое отличается, я создал 3 разных шаблона. Однако структура строки меню одинакова, за исключением содержимого, поэтому я обнаружил, что у меня много дублирующегося кода. Есть ли способ иметь только один шаблон и по-прежнему заполнять контент внутри строки меню по-разному в зависимости от того, на какой странице вы находитесь?

Настройка содержимого шаблона 1 (я сделать то же самое для двух других шаблонов, но только название отличается):

Template.pictureMenu.contents = function(){ 
    ... 
}; 

Фактический шаблон (я делаю то же самое для двух других шаблонов, но только имя отличается):

<template name="pictureMenu"> 
    <div class="navbar"> 
    <div class="navbar-inner"> 
     <div class="container"> 
     <a class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse"> <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
     </a> 
     <a class="brand" href="#">Media Menu</a> 
     <div class="nav-collapse collapse"> 
      <ul class="nav"> 
      <li> 
       <a href="#">Upload</a> 
      </li> 
      <li class="dropdown"> 
       <a class="dropdown-toggle" data-toggle="dropdown" href="#">Playlists<b class="caret"></b></a> 
       <ul class="dropdown-menu"> 
       **{{#each contents}} <!-- This is the only thing that changes--> 
        <li> 
         <a href="#" class="viewPlaylist">{{this}}</a> 
        </li> 
       {{/each}}** 
       </ul> 
      </li> 
      <li> 
       <a href="#">Share</a> 
      </li> 
      </ul> 
      <form action class="navbar-search pull-right"> 
       <input class="search-query span2" placeholder="Search" type="text"> 
      </form> 
     </div> 
     </div> 
    </div> 
    </div> 
</template> 

Как я могу свести его к 1 шаблону и передать его другому содержимому?

Answer 1

Вы можете переименовать шаблон «меню» только, а затем вставить конкретное содержание в месте, где содержание меняется:

<template name="menu"> 
    ... 
    <ul class="dropdown-menu"> 
    {{#each currentMenu}} 
     <li>{{itemName}}</li> 
    {{/each}} 
    </ul> 
    ... 
</template> 

Template.menu.currentMenu = function() { 
    return Session.get("currentMenu"); 
} 

Затем при смене места на вашем сайте, и вы хотите, чтобы обновить меню, просто обновите сеанс:

var newMenu = [{itemName: "item1"}, {itemName: "item2"}, {itemName: "etc"}]; 
Session.set("currentMenu", newMenu);