doT.js return [object HTMLScriptElement]

Question

doT.js Начинающий здесь, поэтому будьте нежны. Я пытаюсь начать с простой рамки. Прочитав первую страницу, я смог получить все примеры для работы. Однако перенос doT.js на мое собственное решение кажется более сложной задачей, чем я себе представлял.

Я пытаюсь создать простую таблицу, используя doT.js, чтобы отобразить ее содержимое.

JsFiddle here.

Использование собственного редактора doT.js, я был в состоянии получить этот очень простой блок кода обработки:

{{~it :v:i}} 
<tr> 
    <td>{{= i+1 }}</td> 
    <td>{{= v }}</td> 
</tr> 
{{~}} 

Остальная часть моего сценария:

var conts = ['apples','pears','peaches','cherries']; 
var popConts = doT.template(contactsTmpl)(conts); 
$("#contactsList").html(popConts); 

Первая строка объявляет данные, второй привязывает его к моему шаблону, а третий вставляет его в DOM. Однако это приводит к появлению [object HTMLScriptElement], показывающему, где я надеялся увидеть содержимое моей таблицы.

Может ли кто-нибудь объяснить мне простым образом, что мне здесь не хватает?

Answer 1

Один шаг не хватает. Обновлено jsFiddle: https://jsfiddle.net/oe1d3a0w/1/

var conts = ['apples','pears','peaches','cherries']; 
var contactsTmpl = $("#contactsTmpl").html(); 
var popConts = doT.template(contactsTmpl)(conts); 
$("#contactsList").html(popConts); 

1. Объявляет данные
2. получить содержимое шаблона
3. связывают содержание шаблона с данными
4. Вставьте результаты в DOM

doT.tempalte() автоматически не связывается с чем-то id, но вместо этого принимает его экспресс ионов.