Node.js express，handlebars - 获取数组的元素答案

【问题标题】：Node.js express, handlebars - get elements of an arrayNode.js express，handlebars - 获取数组的元素
【发布时间】：2012-12-04 20:04:05
【问题描述】：

我有一个这样的数组：

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
});
});

而且我不知道如何在客户端进行迭代以使数组中的所有元素都可下载。

在客户方面，我有一个包含链接的无序列表。问题是，我不知道如何实现这一目标。

客户端的代码：

<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>

感谢您的回答。

【问题讨论】：

`{{arr.0}} 更好吗？如果不能，请您发布您想要实现的伪代码？
我有一个代码：app.get('/download',function(req,res){ var items; fs.readdir('./download',function(err,files){ for (var i=0;i
好的，您能否更新您的问题以反映该要求？另外，请发布您已经尝试过的内容。

标签： node.js handlebars.js

【解决方案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> 将包含列表中包含的文件名。要访问它，您必须创建一个链接到控制器 app.get('/getActualFile', function(){ //serve the file here }); 的 <a>，然后将获取的文件写入响应。

希望这可以为您指明正确的方向，并且在把手中使用迭代器更加明显。

我自己不喜欢车把，但那是因为我完全不习惯。我自己更喜欢 Node.js 的这种模板语言，http://paularmstrong.github.com/swig/

它具有更“清晰”的语法，但考虑到您可以自定义 Handlebars 的不同方式，它可能比 Handlebars 更糟糕。

【讨论】：

【解决方案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>

如果您有多个键值对，它们可以存储在一个数组中并以相同的方式访问。

【讨论】：

【解决方案3】：

试试这个：

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

【讨论】：