0

私はHandlebars.jsとhttp://pragmaticly.github.com/smart-time-ago/を使用しています

私はこれを機能させています：

<time class="timeago" datetime="2012-07-18T07:51:50Z"></time>

ここでデモを行います:デモ

しかし、ここに示すようにハンドルバーのロジック内に時間を追加すると...

<div id="handlebarsPlaceholder">This will get replaced by handlebars.js</div>
    <script id="aaronsTemplate" type="text/x-handlebars-template">
        {{#messages}}
         <li>
            <a href="#messageID{{messageID}}">
                <time class="timeago" datetime="2012-07-18T07:51:50Z"></time>
                <strong>{{from}}</strong><br/>
                {{subject}}
            </a>
         </li>
        {{/messages}}
        </script>
    </ul>
</div>

...それは動作しません。

何が欠けていますか、または答えにつながる記事はありますか? 私はグーグルでどこでも検索しましたが、正しい検索用語を持っていてはなりません.

ありがとう！

4

1 に答える 1

2

aには HTML が含まれていないため、$('.timeago').timeago()呼び出しは a 内のものを検出しません (これが、特にテンプレート コンテナーで使用しない理由です)。<script type="text/x-handlebars-template"><script>type="text/html"

.timeago()テンプレートに入力して取得した HTML を呼び出すだけです。このようなもの：

var t = Handlebars.compile($('#aaronsTemplate').html());
$('#handlebarsPlaceholder').html(t({ ... });
$('#handlebarsPlaceholder .timeago').timeago();

最後の行はあなたが見逃していたものです。

また、HTML が少しずれており、テンプレートに</div>抜けがあり、開口部がありません。<ul>次のようなものが必要です。

<div id="handlebarsPlaceholder">This will get replaced by handlebars.js</div>
<script id="aaronsTemplate" type="text/x-handlebars-template">
    <ul>
        {{#messages}}
            <li>
                <!--... -->
            </li>
        {{/messages}}
    </ul>
</script>

デモ (簡素化されたテンプレートを使用): http://jsfiddle.net/ambiguous/89Bwx/1/

于 2012-10-17T16:44:05.757 に答える