2

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 フォークを使用しています。

バグを見つけましたか、それとも見逃しましたか?

4

1 に答える 1

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変数として保存すると、機能します。

于 2012-09-27T20:35:37.497 に答える