29

ツイートを表示する小さなプラグインを作成しました。以下は、ツイートをループして表示するコードです。

    <script id="tweets-template" type="text/x-handlebars-template" >
        {{#each this}}
        <li>
        <p>{{tweet}}</p>
            <span id="author">{{author}}<span/>
        </li>
        {{/each}}
    </script>

しかし、私がやりたいのは、ツイートの数を 5 または 10 に制限することです。しかし、ループは利用可能なすべてのツイートをリストしています。for ループのようにツイートを制限するにはどうすればよいですか。お気に入り

    for(i=0;i<5;i++){display the tweets}
4

4 に答える 4

42

2つの選択肢があると思います。

  1. コレクションをハンドルバーに渡す前に、コレクションのサイズを制限してください。
  2. 制限を指定できる独自のブロックヘルパーを作成します。

実際のeach実装は非常に単純なので、上限を含めるように適応させるのはかなり簡単です。

// Warning: untested code
Handlebars.registerHelper('each_upto', function(ary, max, options) {
    if(!ary || ary.length == 0)
        return options.inverse(this);

    var result = [ ];
    for(var i = 0; i < max && i < ary.length; ++i)
        result.push(options.fn(ary[i]));
    return result.join('');
});

次に、テンプレートで：

<script id="tweets-template" type="text/x-handlebars-template" >
    {{#each_upto this 5}}
        <li>
            <p>{{tweet}}</p>
            <span id="author">{{author}}<span/>
        </li>
    {{/each_upto}}
</script>
于 2012-04-30T02:28:36.140 に答える
4

「それぞれ」はもはや単純ではありません: https://github.com/wycats/handlebars.js/blob/master/lib/handlebars/base.js#L99

これは、おそらく引き続きアクセスしたいループ情報のホスト全体をそれぞれがサポートするようになったためです。

したがって、より複雑なそれぞれを再実装したくない場合は、早い段階でデータを制限することをお勧めします。最新バージョンのハンドルバーを使用している場合は、each 内で部分式 ({{#each (limit data 6)}} を使用することもできます。

于 2014-02-24T16:27:59.677 に答える