javascript - 无法使用dust.js 渲染一个简单的表格

Question

我无法使用dust.js 渲染一个简单的表格

这个模板：

<table>
    {#hours}
    <tr>
        <td>{dayText}</td>
        <td>{hoursText}</td>
    </tr>
    {/hours}
</table>

输出：

<table>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

而将模板更改为无序列表可以正常工作：

<ul>
    {#hours}
    <li>{dayText}&nbsp;{hoursText}</li>
    {/hours}
</ul>

这是模型：

{
hours: [
    {dayText: "Mo-Fri ", hoursText: "11:00-22:00"},
    {dayText:"Sat", hoursText: "12:00-22:00"},
    {dayText:"Sun", hoursText: "12:00-21:00"}
    ]
}

模板是使用dust-full-1.1.0.js 在浏览器中编译的，我使用的是LinkedIn fork。

我是否发现了错误或错过了什么？

Answer 1

我找到了我的问题的原因。我的模板源是从页面内加载的：

$("#dust-templates").children().each(function() {
        var compiled = dust.compile($(this).html(), $(this).attr('id'));
        console.log(compiled);
        dust.loadSource(compiled);
    })

问题是浏览器没有逐字传递模板 html：

{#hours}

{/hours}
<table>
<tbody><tr>
    <td>{dayText}</td><td>{hoursText}</td>
    </tr></tbody>
</table>

所以这并不像预期的那样工作并不奇怪。如果我将模板存储为 javascript 变量，它就可以工作。