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分叉。

我发现了一个错误或错过了什么吗？

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变量，它就可以工作。

无法使用dust.js呈现简单的表

1 个答案: