node.js - Node.jsエクスプレス、ハンドルバー-配列の要素を取得します

Question

私はこのような配列を持っています：

var arr = ["element1","element2"];

その要素をハンドルバーファイルに入れたいと思います。

私は結果なしでグーグルで検索しましたが、私が見つけた唯一の解決策はこれです：

{{#each files}}
<a href="/"{{path}}"">{{title}}</a>
{{/each}}

しかし、ディレクトリ内のすべてのファイルをダウンロードできるようにしたいので、これは私には良くありません。

サーバー側で試したコード：

app.get('/download',function(req,res){
var items;
fs.readdir('./download',function(err,files){
        items = files;
});

res.render('download',{
    files:items
});
});

また、クライアント側で反復して、配列内のすべての要素をダウンロード可能にする方法がわかりません。

clien側では、リンクを含む順序付けられていないリストがあります。問題は、それをどのように達成するかがわからないことです。

clien側のコード：

<div id="container">
            <div class="highlight">
                <img src="img/highlight.png"></img>
                <p>A Click to download</p>
            </div>
            <ul>
                <li class="RoundedAll"><a href="/">Back</a></li>
            </ul>
            <br />
            <ul>
                <!-- What should I put here? -->
            </ul>
        </div>

回答ありがとうございます。

Answer 1

まず、あなたfiles:itemsがこのようなハンドルバーの配列であると仮定しましょう。

{ files:['filenameOne.ext', 'filenameTwo.ext', 'filenameThree.exe'] };

これを応答に記述し、handlebars.jsの配列をループしたい場合、コードを使用すると、これがHTMLの外観になります。

<div id="container">
    <div class="highlight">
        <img src="img/highlight.png"></img>
        <p>A Click to download</p>
    </div>
    <ul>
        <li class="RoundedAll"><a href="/">Back</a></li>
    </ul>
    <br />
    <ul>
        {{#each files}}
        <li>{{this}}</li>
        {{/each}}
    </ul>
</div>

には<li>{{this}}</li>、リストに含まれているファイル名が含まれます。次にそれにアクセスするには<a>、コントローラーにリンクするをapp.get('/getActualFile', function(){ //serve the file here });作成し、フェッチされたファイルを応答に書き込む必要があります。

これが正しい方向を示し、ハンドルバーでのイテレータの使用がもう少し明白になることを願っています。

私自身はハンドルバーを好みませんが、それは私が完全に慣れていないためです。私自身、Node.js用のこのテンプレート言語の方が好きです。http ：//paularmstrong.github.com/swig/

構文はもう少し「明確」ですが、ハンドルバーをカスタマイズする方法が異なることを考えると、ハンドルバーよりもおそらく劣ります。

Answer 2

これをどのようにコーディングするかを機能させるには、キーと値のペアが必要です。

var arr = {path: "element1", title: "element2"};

以下：

var arr = {path: "downloads/mynewdownload", title: "My New Download"};

{{#each arr}}
     <a href="/{{path}}">{{title}}</a>
{{/each}}

降伏します：

    <div id="container">
        <div class="highlight">
            <img src="img/highlight.png"></img>
            <p>A Click to download</p>
        </div>
        <ul>
            <li class="RoundedAll"><a href="/downloads/mynewdownload">My New Download</a></li>
        </ul>
        <br />
    </div>

複数のキーと値のペアがある場合は、それらを配列に格納して同じ方法でアクセスできます。

Answer 3

これを試して：

<ul>
{{#each people}}
   <li>{{this}}</li>
{{/each}}
</ul>