2013-11-30 3 views
5

Я использую handlerbars для создания шаблонов. Предположим, что я делаю список TODO. У меня есть коллекция, и мне также нужна поддержка добавления новых элементов TODO с тем же стилем.HandleBars - шаблон внутри шаблонов

До сих пор у меня есть коллекция шаблонов TODO:

<script id="TODO-collection-templ" type="text/x-handlerbars-template"> 
    <div id="collection"> 
     <ul> 
      {{#list todos}} 
       <li><span>{{this.title}}</span><span>{{this.description}}</span></li> 
      {{/list}} 
     </ul> 
    </div> 
</script> 

Если я хочу, чтобы добавить новые элементы, единственный способ (для меня) было бы создать еще один шаблон, который строит следующее:

<script id="TODO-templ" type="text/x-handlerbars-template"> 
    <li><span>{{title}}</span><span>{{description}}</span></li> 
</script> 

Итак, у меня есть два шаблона, но они подвержены ошибкам (если я что-то изменил в TODO-collection-templ, и я забыл сделать то же самое изменение над TODO-templ, он не будет отображать Html правильно)

Есть ли способ включить TODO-templ внутри TODO-collection-templ ??

ответ

6

Есть обертоны в Рули, как в Усы годы: http://blog.teamtreehouse.com/handlebars-js-part-2-partials-and-helpers

В принципе вы можете организовать микро-шаблон как частичный и использовать его в большем шаблоне:

<script id="TODO-partial" type="text/x-handlebars-template"> 
    <li><span>{{title}}</span><span>{{description}}</span></li> 
</script> 

<script id="TODO-collection-templ" type="text/x-handlebars-template"> 
    <div id="collection"> 
    <ul> 
     {{#list todos}} 
      {{> TODO}} 
     {{/list}} 
    </ul> 
    </div> 
</script> 
+1

Можем ли мы получить доступ поля от внешнего шаблона внутри внутреннего шаблона? –

+0

@AniketThakur да, найдите «Частичные параметры» на [этой странице] (http://handlebarsjs.com/partials.html). – mgalgs

Смежные вопросы