Начало работы с ручками

Question

Я впервые за рулем ружей; моя цель - отобразить список элементов в html.

Это скрипт внутри HTML:

<div> 
    <script id="list-items" type="text/x-handlebars-template">​ 
    {{#each list}} {{ price }} {{/each}} 
    </script> 
</div> 

Это файл JS:

var list = [ 
      { 
      name: 'Almond Toe Court Shoes, PatentBlack', 
      category: 'Women\'s footwear', 
      price: 42, 
      quantity: 5 
      }, 
      { 
      name: 'Bla bla bla', 
      category: 'Women\'s footwear', 
      price: 66, 
      quantity: 5 
      } 
     ]; 


 var theTemplateScript = $("#list-items").html();
 
  


 var theTemplate = Handlebars.compile (theTemplateScript); 

 
  

 $(document.body).append (theTemplate (list)); 

Мой код не работает, и я не вижу никаких ошибок в консоли. Что я делаю неправильно?

Answer 1

Ваш шаблон итерации над атрибутом list, но вы передаете необработанный массив.

Чтобы согласовать шаблон и данные, которые вы пройти, либо передать объект с list атрибута:

$(document.body).append (theTemplate ({ 
    list: list 
})); 

http://jsfiddle.net/nikoshr/hm6psg9w/1/

или изменить шаблон перебрать массив:

<script id="list-items" type="text/x-handlebars-template">​ 
    {{#each .}} {{ price }} {{/each}} 
</script> 

http://jsfiddle.net/nikoshr/hm6psg9w/